angularjs - 在项目数组中选择性地应用“ng-class”

Question

我有一个复选框列表。ng-class当我单击复选框时，我试图有条件地将一个类应用于已选中的项目。我当前设置的问题是，当我单击复选框时，它将类应用于所有项目，而不是所需的复选框项目。

我如何正确定位特定项目ng-class而不是所有项目？

HTML

 <ul class="todos">
    <li ng-repeat="todo in todoItems" class="todo">
        <input type="checkbox"
          ng-click="delete($index)"
          id="todo-{{todo.id}}"/>
        <span class="todo-title"
          ng-class="{striked: thisTodoStriked === true}"
          >{{todo.title}}</span>
    </li>
  </ul>

咖啡

$scope.thisTodoStriked = false
$scope.delete = (indexedItem) ->
    TodoFactory.todos.getList().get(indexedItem).then (item) ->
        $scope.thisTodoStriked = true
        console.log 'delete invoked'

Answer 1

那是因为你告诉代码要删除所有这些。

更好的选择是添加thisTodoStriked到项目中。

我不知道 CoffeeScript，但等效的 JavaScript：

$scope.delete = function (item){
  $scope.todoItems[item].thisTodoStriked = true;
}

然后，在您的模板中：

<span class="todo-title"
      ng-class="{striked: todo.thisTodoStriked === true}"
      >{{todo.title}}</span>