Question

我有像角色代码一样的功能选项卡。我只想知道它是如何工作的。当我点击它的执行选择（datalist）时，它的执行isActive（datalist）和isActive1（$ index）。所以我的问题是ng-click执行在同一个控制器中使用的所有函数。

另外我注意到函数正在执行两次。这是isActive（$ index）的日志。

http://jsfiddle.net/zbjks9wy/1/

HTML

<div ng-app="sampleapp">
    <div ng-controller="samplecontoller" ng-init="showData()">

 <ul>
 <li class="paginationclass" ng-repeat="datalist in datalists" ng-click="select(datalist)" ng-class="{active: isActive(datalist)}">
 <div ng-class={active:isActive1($index)}>{{ datalist.name }} </div> 
 </li>
</ul> 
    </div>
</div>

角

var myapp = angular.module('sampleapp', [ ]);
myapp.controller('samplecontoller', function ($scope) {
$scope.showData = function( ){
     $scope.datalists = [
    { "name": "Read about angular"},
    {"name": "Read about knockout"},
    {"name": "Read about backbone"},
    {"name": "Read about jquery"},
    {"name": "Read about javascript"}
    ]
}

$scope.select= function(item) {
           $scope.selected = item; 
    };
$scope.isActive = function(item) {
           return $scope.selected === item;
    };

    $scope.isActive1 = function(index) {
    console.log(index)
           return $scope.sd === index;
    };

});

Answer 1

当您点击li时，会触发ng-click，并更新状态等。它还会触发Angular $digest周期，刷新页面。每次它在页面中运行时，都需要评估ng-class上的div并导致日志记录。希望有所帮助。

ng-click和ng-class如何在角度

1 个答案: