Angular js 模型没有得到更新

Angular js model not getting updated

我是 angular js 的新手。我有以下代码

 <div ng-controller="myCtl">     

                <input type='checkbox' ng-model='selectAll'/>Select All
                <div ng-repeat="c in language.availableOptions">
                     <input type='checkbox' ng-model='language.opted[$index]' 
                     ng-checked="selectAll" ng-true-value='{{c}}'
                     ng-false-value=""/>
                     {{c}}          
                </div>         
                    {{selectAll}}
                   selected languages : {{language.opted}}    
            </div>    

   <script type="text/javascript">
    /**
     *  Module
     *
     * Description
     */
    var myApp = angular.module('myApp', []);

    myApp.controller('myCtl', ['$scope', function($scope) {

        $scope.language ={};
        $scope.language.availableOptions = ["java","c","cpp","asp"];
        $scope.language.opted=[];
        $scope.selectAll=false;

    }])


    </script>

想法是,如果用户 selects select all 那么所有语言都将被 selected 并更新相应的模型 [language.opted]。

现在,如果我 select 'select all' 复选框所有复选框都 selected,但模型是空的。为什么?

查看 ng-checked

的文档

Note that this directive should not be used together with ngModel, as this can lead to unexpected behavior.

所以,试试其他方法。


我建议在输入中使用 ng-change,在控制器中使用一个函数将每个模型设置为当前值:

ng-change="changeSelectedValue(language.opted[$index])"

在控制器中:

$scope.changeSelectedValue = function(value){
  // Sets the value of every $scope.language.opted to "value"
}