首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >AngularJS:在.post()之后添加事件监听器

AngularJS:在.post()之后添加事件监听器
EN

Stack Overflow用户
提问于 2016-05-07 17:31:31
回答 3查看 986关注 0票数 1

我正在尝试学习开发,所以如果我有点不知情,很抱歉。我试着在这里搜索解决方案。我必须做一个评论和回复应用程序。我正在使用此函数向我的视图添加注释。

代码语言:javascript
运行
复制
$scope.insertComment = function(){

    var new_comment_id = $scope.comments[$scope.comments.length - 1].commentID +1;
    var input = {
        "commentID" : new_comment_id,
        "userID": user.user_id,
        "name": user.user_name,
        "avatar_url": user.avatar,
        "says": $scope.new_comment,
        "likes": 0,
        "like_status": false,
        "replies": [] 
    };
    //Pushes changes to the global comment object
    $scope.comments.push(input);
    $scope.new_comment = '';
}

每条评论都有回复选项,下面的事件显示了一个表单来添加回复到评论。

代码语言:javascript
运行
复制
$(".no-url").click(function(){
    console.log('test2');
    $(this).parent().children('.reply-form').addClass('active');
});

我的问题是,当我添加一个新的评论时,它并没有关联到这个事件监听器。如何解决这个问题?

EN

回答 3

Stack Overflow用户

发布于 2016-05-07 17:36:58

$(SELECTOR)将只选择那些存在于DOM中的元素。

可以使用Event-Delegation

代码语言:javascript
运行
复制
$(PARENT_SELECTOR).on('click', '.no-url', function() {
  $(this).parent().children('.reply-form').addClass('active');
});

但更好的和推荐的解决方案是使用ng-click指令。

票数 1
EN

Stack Overflow用户

发布于 2016-05-07 17:40:01

jQLite中使用directive

HTML:

代码语言:javascript
运行
复制
 <div comment-click> 
    //your comment html will goes here.
 </div>

JS:

代码语言:javascript
运行
复制
app.directive("commentClick",function(){

    return {
        link : function(scope,ele,attr){

            ele.on('click',function(){

                //put here your commnet scropt

            })
        }
    }
})

将此comment-click属性添加到要绑定单击事件的新添加的DOME元素中

票数 1
EN

Stack Overflow用户

发布于 2016-05-07 18:27:09

以下是简化的代码,如何在不涉及jQuery的情况下仅使用angularjs完成此操作

代码语言:javascript
运行
复制
<div class="comment" ng-repeat="comment in comments track by $index>
  <p>{{comment.text}}</p>
  <button ng-click="comment.reply = true">reply to comment</button>
  <form ng-if="comment.reply">
    <textarea ng-model="reply"></textarea>
    <button ng-click="submitReply()">submit reply</button>
  </form>
</div>
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/37086834

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档