javascript - angularjs 列表中单个项目的隔离范围

Question

我有一个使用 ng-repeat 填充的项目列表

<ul>
    <li ng-repeat="item in items" ng-class="setClass" ng-click="assignClass()">{{item.name}}</li>
</ul> 

在我的 Controller 中

$scope.assignClass = function(){
    $scope.setClass = "sampleClass";
}

当我这样做并点击任何一项时，所有项目都会添加 sampleClass。

我需要这个场景，

当我点击第一个项目时，该项目应该有 sampleClass，当我点击第二个项目时，我希望第一个和第二个项目都应该有 sampleClass

我怎样才能实现这种情况？

Answer 1

我们使用的代码设置了您提到的所有列表项的样式。我稍微更改了代码以设置无序列表中单个项目的类。通过使用所选项目作为参数调用 assignClass，您可以为该项目设置类。

<ul>
    <li ng-repeat="item in items" ng-class="item.setClass" ng-click="assignClass(item)">
        {{item.name}}
    </li>
</ul> 


$scope.assignClass = function(selectedItem){
    selectedItem.setClass = "sampleClass";
}