AngularJs : Passing parameter to ng-click in directive

Question

I have a directive in which i am adding an a button and an ng-click on the button. My code for directive is

AppDirectives.directive(
                'feed',
                function() {
                    return {
                        restrict : 'AE',
                        scope : {
                            feedMsg : '@feedText',
                            feedUser : '@feedUser',
                            feedTimestamp : '@feedTimestamp',
                            feedLike : '@feedLike',
                            feedDislike : '@feedDislike',
                            likeClick: '&',
                            dislikeClick :'&',
                            feedUid : '@feedUid'
                        },
                        template : '<div class="media">'+
                                        '<a class="pull-left" href="#"><img class="media-object" src="resources/images/holder.png" style="height:64px; width:64px;" alt="img"></a>'+
                                        '<div class="media-body">'+
                                            '<h4 class="media-heading">{{feedUser}}</h4>'+
                                            '<h5>{{feedMsg}}</h5>'+
                                            '<p> <a ng-click="likeClick(feedLike)">Like</a> {{feedLike}} <a ng-click="dislikeClick(feedUid)">Dislike</a> {{feedLike}} {{ feedTimestamp | date:medium }} </p>'+
                                        '</div>'+
                                    '</div>',
                        replace : true,

                    };
                });

my html code is

<feed feed-uid={{feed.uid}} feed-text={{feed.feedText}} feed-user={{feed.userUid}} feed-timestamp={{feed.time}} feed-like={{feed.like}} like-click="likeClick(uid)" dislike-click="dislikeClick(uid)" feed-dislike={{feed.dislike}}></feed>

and my contoller have

$scope.dislikeClick = function(feedUid){
        console.debug("dislike"+feedUid);
    }

When i click on the dislike button, i get 'like undefined', where i am suppor to print the 'like uid_of_post'. can any one kindly tell me what is wrong with my code. As {{feedUid}} get the correct value inside the template.

possible duplicate of [AngularJS getting $event from a directive](http://stackoverflow.com/questions/16042863/angularjs-getting-event-from-a-directive) — Jonathan Rowny, Dec 19 '13 at 20:46

score 5 · Accepted Answer · edited May 23 '17 at 12:32

from the documentation on $compile, which houses directive docs:

Often it's desirable to pass data from the isolated scope via an expression and to the parent scope, this can be done by passing a map of local variable names and values into the expression wrapper fn. For example, if the expression is increment(amount) then we can specify the amount value by calling the localFn as localFn({amount: 22}).

So in this case you'd be doing ng-click="dislikeClick({uid: feedUid})" and then from your html just do dislike-click="dislikeClick(uid)"

I'm answering to make this specific to your use case, but I think this is pretty much the same question as: AngularJS getting $event from a directive

AngularJs : Passing parameter to ng-click in directive

1 Answers1