我学习angularJS。 我无法找到一种方法来移除所选项目,即删除'点击按钮。
有什么办法吗?
附加代码:
<ul class="unstyled">
<li ng-repeat="todo in todos">
<input type="checkbox" ng-model="todo.done">
<span class="done-{{todo.done}}">{{todo.text}}</span>
<button class="btn" ng-click="removeTodo()">Remove</button>
</li>
</ul>
答案 0 :(得分:3)
var app = angular.module("app" , []);
app.controller("MyCtrl" , function($scope){
$scope.todos = [
{"text" :"Learn AngularJS","done":false},{"text" :"build an app","done":false}];
$scope.removeTodo = function(index) {
$scope.todos.splice(index,1);
}
$scope.removeTodo2 = function(todo) {
var index = getByValue( $scope.todos,todo);
$scope.todos.splice(index,1);
}
$scope.addTodo = function(todo){
var toDoObject = {"text":todo,"done":false};
$scope.todos.push(toDoObject);
};
$scope.done = function(todo){
angular.forEach($scope.todos,function(index,todo1){
if(todo == todo1)
$scope.todos[index].done = !$scope.todos[index].done;
})
}
function getByValue(arr, value) {
for (var i=0, iLen=arr.length; i<iLen; i++) {
if (arr[i].text == value) return i;
}
}
});
&#13;
.done{
text-decoration: line-through;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="MyCtrl">
<ul class="unstyled">
<li ng-repeat="todo in todos track by $index">
<input type="checkbox" ng-model="todo.done" >
<span ng-class="{'done' : todo.done == true}">{{todo.text}}</span>
<button class="btn" ng-click="removeTodo($index)">Remove</button>
<button class="btn" ng-click="removeTodo2(todo.text)">Remove2</button>
</li>
</ul>
<input type="text" ng-model="todo">
<input type="button" ng-click = "addTodo(todo)" value="Add">
</div>
&#13;