AngularJs:将参数传递给ng-click in指令

时间:2013-12-19 20:06:34

标签: angularjs angularjs-directive angularjs-scope

我有一个指令,我在其中添加一个按钮并按下按钮。我的指令代码是

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,

                    };
                });

我的HTML代码是

<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>

和我的控制器

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

当我点击不喜欢按钮时,我得到'like undefined',我支持打印'like uid_of_post'。任何人都可以告诉我我的代码有什么问题。当{{feedUid}}在模板中获取正确的值时。

1 个答案:

答案 0 :(得分:5)

来自$compile的文档,其中包含指令文档:

  

通常需要通过表达式将数据从隔离范围传递到父范围,这可以通过将局部变量名称和值的映射传递到表达式包装器fn来完成。例如,如果表达式是increment(amount),那么我们可以通过将localFn称为localFn({amount:22})来指定金额值。

所以在这种情况下你会做ng-click="dislikeClick({uid: feedUid})",然后从你的html做dislike-click="dislikeClick(uid)"

我正在回答这个具体针对您的用例,但我认为这几乎是同一个问题:AngularJS getting $event from a directive