2016-10-09 2 views
4

다음 코드에서는 Angularjs에 todo 응용 프로그램을 작성하려고합니다. AngularJS에서 todo 목록을 쓰는 동안 삭제 프로세스를 이해할 수 없습니다.

function write_controller($scope){ 
 
    $scope.todos = [{text:'hey all',done:false}, 
 
       {text:'hello',done:false}]; 
 
    $scope.addtodo = function(){ 
 
    $scope.todos.push({text:$scope.todopush,done:false}); 
 
    $scope.todopush = ''; 
 
    } 
 
    $scope.delete = function(){ 
 
    var oldtodos = $scope.todos; 
 
    $scope.todos = []; 
 
    angular.forEach(oldtodos, function(x){ 
 
     if (!x.done){ 
 
     $scope.todos.push(x);} 
 
    }); 
 
    }; 
 
}
<html ng-app> 
 
    <head> 
 
    <script src = 
 
    "https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"> 
 
     </script> 
 
     </head> 
 
     <body> 
 
     <div class = "basic_class" ng-controller = "write_controller"> 
 
     <ul> 
 
     <li ng-repeat = "todo in todos"><input type = "checkbox" ng-model 
 
     ="todo.done">{{todo.text}}</input></li> 
 
     </ul> 
 
     <input type = "text" 
 
     placeholder = "please add data here" 
 
     ng-model="todopush"> 
 
     </input> 
 
     <input type = "button" ng-click ="addtodo()" value ="Click me!!"></input> 
 
     <input type = "button" ng-click = "delete()" ng-model="remove" value = 
 
     "remove!"></input> 
 
     </div> 
 
</body> 
 
</html>
다음 코드에서

, 나는 다음과 같은 질문이 있습니다. 삭제 작업은 어떻게 작동합니까 ??

나의 이해 : 1)은 새로운 배열 2)은 3) 반복 해 새 배열 3) 수행 기능 검사를 통해 대한 기존 배열을 해제로 기존의 배열을 밀어 ??? (그것이 말할 때! x.done는 진실하거나 틀린가요?) 어떤 도움이 높게 평가 될 것입니다. 단계

$scope.delete = function() { 
    // store existing todos array in variable 
    var oldtodos = $scope.todos; 
    // create new empty array for todos 
    $scope.todos = []; 
    // loop over previously stored todos 
    angular.forEach(oldtodos, function(x) {//x is element of the array - a single todo object 
     // if x.done is not truthy 
     if (!x.done){ 
     // push this item into `$scope.todos` 
     $scope.todos.push(x); 
    }); 
} 

통해

+0

을 제거 $scope.todos의 새 버전에 done:false을 밀어? 코드에 따르면 삭제는 작동하지 않을 것이다 – Sajeetharan

+0

@Sajeetharan 왜 안되냐 ... 나를 위해 일한다 – charlietfl

+0

코드를 공유하려면 jsfiddle 또는 비슷한 것을 사용한다. – r1verside

답변

1

워크는 기본적으로는 효과적으로 당신이 코드를했던 done:true

+0

체크 상자를 클릭하면 어떻게 업데이트가 false에서 true로 업데이트됩니까? –

+1

'ng-model = "todo.done"'참조 : https://docs.angularjs.org/api/ng/directive/ngModel – charlietfl

+1

'ng-model'은 데이터 모델 객체에 바인드되어 변경 될 것입니다 체크 박스가 변경되면 – charlietfl