Question

我有这种情况。我想在学校的一个侧翼增加成绩，即课程。同时我想指定一个班级有哪些科目。附上此方案的快照。

在编码方面，首先我获得所有科目的清单。然后我将这个主题数组分配给每个类。现在我想查看一些科目并取消选中，以便我可以为每个班级保存科目。但是当我检查任何一个主题时，所有相同索引的主题都会被检查。例如。当我检查第1课的数学时，所有数学复选框都会被检查。我知道我的编码存在问题。我真的需要你的帮助。我也附上了代码。

获取所有主题

 //get subjects
    $http.post($scope.ClassCTRLUrl + "/getsubjects")
        .success(function (responce) {
            $scope.subjectList=responce.data;
            for(var i=0;i<$scope.subjectList.length;i++){
                $scope.subjectList[i].model=false;
            }

            //get list of all classes
            $scope.getMasterclassList();
        })

获取课程

/* get all classes */
$scope.getMasterclassList=function(){
    $http.post($scope.ClassCTRLUrl + "/getClasses")
        .success(function (responce) {
            $scope.classList=responce.data;
            for(var i=0;i<$scope.classList.length;i++){
                $scope.classList[i].check=false;

                //assign subjects to each class
                $scope.classList[i].subjects= $scope.subjectList;
            }
            console.log($scope.classList);
        })
}

使用嵌套ng-repeat

的前端代码

<tr ng-repeat="class in classList">

                    <td class="padding-top-12"><span ng-bind="($index+1)"></span></td>

                    <td>
                        <span ng-bind="class.class_name" style="float:left;"></span>
                    </td>

                    <td style="text-align: center;">
                        <span ng-repeat="subject in class.subjects ">
                            <input type="checkbox" ng-model="subject.model" ng-true-value="'1'" ng-false-value="'0'" ng-change="print(subject.subject_name)" ><span ng-bind="subject.subject_name"></span>
                        </span>
                    </td>

                    <td style="text-align:center;">
                        <label class="switch ">
                        <input type="checkbox" ng-model="class.check" ng-change="checkOption(class.check,classList.indexOf(class))">
                        <div class="slider round"></div>
                        </label>
                    </td>
                </tr>

实际问题

附加问题快照

单击一个复选框时，将检查多个复选框

0 个答案: