简单检查所有在AngularJS中都不起作用

时间:2015-02-22 07:44:16

标签: angularjs checkbox

我正在尝试为我的待办事项列表中包含一个全部检查,但是一旦我点击toggleAll(),它就会立即取消选中,并且取消选中已经检查过的任何一个。

我真的无法弄清楚为什么这种行为,或许页面中的其他一些东西都是干涉的。我在这里包含的简单版本就是在这个jsfiddle http://jsfiddle.net/TKVH6/487/中,它正在发挥作用。

<section id="main">
                <input id="toggle-all" type="checkbox" ng-model="checkAll" ng-click="toggleAll()">
                <label for="toggle-all">Mark all as complete</label>
                <ul id="todo-list">
                    <li ng-repeat="todo in todos" ng-class="{'completed': todo.isCompleted=='true'}" class="editing">
                        <div class="view" >
                            <input class="toggle" type="checkbox" ng-click="complete(todo)" ng-model="todo.isCompleted" ng-checked="todo.isCompleted" ng-true-value="'true'"  ng-false-value="'false'">
                            <label ng-hide="isEditing" ng-dblclick="isEditing = !isEditing">{{todo.title}}</label>
                            <button class="destroy" ng-click="remove(todo)"></button>
                        </div>
                        <input class="edit" ng-show="isEditing" ng-model="todo.title" ng-blur="isEditing = !isEditing;edit(todo);">
                    </li>
                </ul>
            </section>

控制器

 $scope.toggleAll = function () {
    if ($scope.selectedAll) {
        $scope.selectedAll = true;
    } else {
        $scope.selectedAll = false;
    }
    angular.forEach($scope.todos, function (todo) {
        todo.isCompleted = $scope.selectedAll;
    });
};

编辑1

$scope.toggleAll = function() {
    for(i in $scope.todos) {
        $scope.todos[i].isCompleted = $scope.checkAll;
    }
};

感谢任何帮助。

1 个答案:

答案 0 :(得分:0)

解决了!将布尔值作为字符串处理解决了它。那是因为服务器将布尔值保存为字符串。

$scope.toggleAll = function() {
    for(i in $scope.todos) {
        $scope.todos[i].isCompleted = "" + $scope.checkAll;
    }
};

此时ng-checked="{{todo.isCompleted}}需要返回,因为它不是布尔值。