在angular和vue等mv*框架中做的很多的一个案例就是添加列表再删除
最具有代表性的案例就是todos
点击打开链接
,github地址
点击打开链接
点击当前列表项中某一项进行删除:
下面代码以angular为例:
视图层代码:
<li ng-repeat="todo in data">
<label>{{todo.text}}</label>
<button ng-click="remove(todo)">×</button>
在Controller控制器中定义数组:
$scope.data = [{
text: '测试1',
completed: true
text: '测试2',
completed: false
}];
添加删除函数:
$scope.remove = function(todo){
this.data.splice(this.data.indexOf(todo),1);
}
重要思路就是在删除函数中传入当前的列表项,使用indexOf(当前项)获取到数组当前下标值进行删除