在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(当前项)获取到数组当前下标值进行删除