Angularjs:使用索引删除项目

时间:2017-10-03 14:35:42

标签: angularjs

某些上下文:我有一个使用api的任务列表将每个任务保存到mysql。 我的delete method由带有ng-click(ng-click="remove(todo, $index)")的按钮触发,如下所示:

  $scope.remove = function (todo, index) {
    $http({
      method: 'DELETE',
      url: 'http://api.dev/api/task/delete/' + todo.id }).then(function (response) {
        $scope.todos.splice(index, 1);
      });
  };

这很好用,但我想知道如何在不通过todo并仅使用index的情况下使其正常工作?

1 个答案:

答案 0 :(得分:2)

通过使用相同的数组,您可以填写 - todos列表。假设您没有通过应用过滤器或在创建列表时使用顺序来操纵列表中的项目顺序。

    $scope.remove = function (index) {
    var listElement = $scope.todos[index];
    $http({
      method: 'DELETE',
      url: 'http://api.dev/api/task/delete/' + listElement .id }).then(function (response) {
        $scope.todos.splice(index, 1);
      });
  };

请注意,这不是最佳做法,因为您有时会混淆列表的顺序。

这是一个小演示,展示了我在说什么。查看控制器中的列表顺序。现在,查看HTML中名称后面的索引。

demo