点击功能不适用于ng-if

Question

如果我使用如下，我得到了我需要的..这是代码。

<style>
  .moreMenu {
        position: absolute;
        right: 0px;
        z-index: 10;
        padding: 10px;
        color: #666;
        border-radius: 0 0 0 4px;
        background: #FFF;
        display: none;
        border-top: 1px solid #DDD;
    }
</style>
 <i class="fa fa-ellipsis-v tbButton otherOptions rightSide"  aria-hidden="true"></i>
    <div class="moreMenu">
          heloo
   </div>
<script>
  $(".otherOptions").click(function () {

                $(".moreMenu").slideToggle("fast");
            });
</script>

但如果我使用ng-if条件，

 <i class="fa fa-ellipsis-v tbButton otherOptions rightSide"  aria-hidden="true" ng-if="member==''"></i>

点击功能不起作用。

Answer 1

我解决了这个问题..

<i class="fa fa-ellipsis-v tbButton otherOptions rightSide"  aria-hidden="true" ng-if=members==''" ng-click="mymore()"></i>


// controller
     $scope.mymore = function(){    
        $(".moreMenu").slideToggle("fast");
    }

感谢所有的信息......

Answer 2

使用ng-click会更好，但是如果你需要使用jQuery的click事件，你可以向主体添加一个过滤的click事件：

$('body').on('click', '.otherOptions', function() {
  $('.moreMenu').slideToggle('fast');
});

这将在主体上添加一个事件处理程序，但只有当事件从otherOptions元素冒泡时才会触发。这是一种使用jQuery事件处理动态内容的方法

Answer 3

@athi是你的答案是一个正确的答案。但根据我在这里回答的问题，使用ng-show而不是ng-if。

angular.module("a",[]).controller("ac",function($scope){
   

    });

.otherOptions
{
color: #666;

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="a" ng-controller="ac">
 <input class="otherOptions" type="button" value="hello" ng-click="mymore()" ng-show=true>
    <div class="moreMenu">
          heloodfg
   </div>
   </div>
 <script>
 $(".otherOptions").click(function () {
        $(".moreMenu").slideToggle("fast");
    });
 </script>