如何获得所选的特定项目?

时间:2016-02-27 16:18:26

标签: angularjs

  • 截图附上。

我学习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>

enter image description here

1 个答案:

答案 0 :(得分:3)

&#13;
&#13;
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;
&#13;
&#13;