如何在切换状态后保留角度的复选框值?

时间:2016-01-11 08:30:58

标签: javascript angularjs checkbox ionic

我有一个由JSON结构创建的表,该表有一个带有复选框的过滤器,根据该复选框我们可以选择我们想要在表中一次看到的所有字段,我们可以在一个表格中有5个可见列单次可见。 当我选择5个不同的复选框来重新创建表时,我面临的问题,并且在切换状态后,检查的值不会被保留。  我希望在重新访问该页面时保留最后检查的值。

这是控制器内部的功能,在选择默认的前5个复选框后创建完整表:

function tablePopulate() {
            $scope.filteredLabel = [];
            $scope.unfilteredLabel = [];
            $scope.filteredData = [];
            console.log($scope.unfilteredLabel.length);
            label = FullTableRecord.getLabel(); //Get the full labels  in label[] array
            console.log("anki" + label);
            for (i = 0; i < label.length; i++) {
                var j = 0
                if (i < 5) {
                    $scope.unfilteredLabel.push({
                        label: label[i],
                        value: true,

                    });

                } else {
                    $scope.unfilteredLabel.push({
                        label: label[i],
                        value: false,
                    });
                }

            }
            $scope.filterRemCount=5;
            $scope.clicked = true;
            console.log("unfilterd label at 668");
            console.log($scope.unfilteredLabel.length);
            /*selectField() function called to check which field has been selecteds  */
            localData = TableData.get(); //Get the Complete set of data from TableData service
            $scope.cLoader = false;
            rePaintTable();

        }

此函数检查选中的复选框:

 $scope.selectField = function() {
            console.log("select field function called");
            count = 0;
            for (i = 0; i < $scope.unfilteredLabel.length; i++) {
                //console.log($scope.unfilteredLabel[i].value);
                if ($scope.unfilteredLabel[i].value) {
                    count++; //count variable contains the number of fields selected
                }
            }
            $scope.filterRemCount=count;
            console.log("Count value is:" + count);
            if (count > 4) {
                console.log("inside count >5")
                $scope.clicked = true;

            } else {
                console.log("inside count <5")
                $scope.clicked = false;
            }
            // console.log("$scope.clicked" + $scope.clicked);
            // console.log("$scope." + $scope.clicked);
        }

此函数将根据用户从过滤器中选择的字段集从完整数据集中获取数据

function rePaintTable() {
        $scope.isFilterOpen = false;
        $scope.filteredData = [];
        $scope.filteredLabel = [];
        var tempFilterLabel= [];
        //console.log("inside rePaintTable function");

        for (i = 0; i < $scope.unfilteredLabel.length; i++) {
            if ($scope.unfilteredLabel[i].value) {

                console.log($scope.unfilteredLabel[i].label);
                tempFilterLabel.push($scope.unfilteredLabel[i].label);
                $scope.filteredLabel = tempFilterLabel;

                // $scope.filteredLabel.push($scope.unfilteredLabel[i].label);
            }
        }
        // console.log("Filtered Label");
        //console.log($scope.filteredLabel);
        console.log("Filtered Data");
        console.log($scope.filteredData);
        for (i = 0; i < localData.length; i++) {
            $scope.filteredData.push([]);
            for (j = 0; j < localData[i].length; j++) {
                if ($scope.unfilteredLabel[j].value) {
                    $scope.filteredData[i].push(localData[i][j]);
                }
            }

        }
         console.log("Filtered Data 2");
        console.log($scope.filteredData); this console prints the array of objects according to the checked values only.


    }

0 个答案:

没有答案