Question

我要添加一个自定义角度指令，其中包含一个按钮，用于删除自身。

我的问题是单击按钮removeMe，它无法从阵列中删除项目。知道什么是错的吗？

HTML：

<button type="button" data-ng-click="main.addNew()">Add new!</button>
<div id="container">
    <sample id="$index" list="main.list" data-ng-repeat="item in main.list"></sample>
</div>

指令模板：

<div id="">
  <button type="button" ng-click="removeMe()">Remove Me</button>
</div>

JS：

angular.module('TestApp', [])



.controller('MainController', function () {
    var main = this;
    main.list = [];
   main.addNew = function addNew() {
     main.list.push({id:'sdgsgs'});
   }
})

.directive('sample', function () {
  return {
    restrict: 'E',
    scope: {list: '=', id:'='},
    templateUrl: 'home.html',
    link: function (scope, element, attrs) {
      console.info(scope.list);
      console.info(scope.id);
      scope.removeMe = function removeMe() {
        scope.list.slice(scope.id, 1);
        console.info(scope.list);
      }
    },
    controller: function() {
        console.log("ctrl");
    }
  }
});

Answer 1

嘿，很简单，你在阵列上使用切片而不是拼接。

切片的一个重要方面是它不会更改调用它的数组

使用Splice代替切片：）

scope.list.splice(scope.id, 1);

Plunker

删除按钮不起作用

1 个答案: