javascript - I can't check for multiple choice field in Angular. How can I do it?

Question

I'm not good at Angular. I'm a trainee right now, my angular knowledge is not good. I will be grateful if you could help me. I have a multiple choice field in the front. But I am encountering an error in Js. I select one of the fields then remove it and select another field but it selects its values along with the previous selected field. So in short, I choose the value 1 at first. Then I remove that selection and select the value 2. The value comes in as "2,1". Here I normally remove the "1" value. It's coming wrong so it doesn't come.

My codes are as follows.

.cshtml:

<div style="margin:5px 0;"></div>
            <a class="btn btn-default" style="width:100%" ng-click="showFacility()">Select Store...<span class="glyphicon glyphicon-chevron-down pull-right"></span></a>
            <div class="listbutton" ng-show="ShowFacility">
                <div class="listbox" data-offset-top="50">
                    <a class="btn btn-default allselectbutton" ng-click="checkall()">Select All</a>
                    <a class="btn btn-default allselectbutton" ng-click="checkallnot()">Remove All</a>
                </div>
                <div style="padding-top:20px;">
                    <div style="float:none;" ng-repeat="fac in facilitys">
                        <label class="checkbox-inline">
                            <input ng-model="fac.checked" type="checkbox" value="{{fac.Id}}" ng-click='Checked(fac)' /><p>{{fac.title}}</p>
                        </label>
                    </div>
                </div>
            </div>

.js:

 $scope.Checkedval = "";
    $scope.CheckedId = "";
    $scope.checkall = function () {
        $scope.CheckedId = "0,4,6,7,2,5,9,8,3,10,1";
        angular.forEach($scope.facilitys, function (value, key) {
            value.checked = true;

        });
    }

 $scope.checkallnot = function () {

        angular.forEach($scope.facilitys, function (value, key) {
            value.checked = false;
            $scope.CheckedId = "";
        });

    }

    $scope.Checked = function (dat) {
        $scope.a = "";
        $scope.spn = false;
        if (dat.checked) {
            $scope.spn = true;
            if ($scope.Checkedval.length == 0) {
                $scope.Checkedval = dat.title;
                $scope.CheckedId = dat.id;
            }
            else {
                $scope.Checkedval += "," + dat.title;
                if ($scope.CheckedId.length == 0) {
                    $scope.CheckedId += dat.id;
                }
                else {
                    $scope.CheckedId += "," + dat.id;
                }
            }
        } else if (!dat.checked) {

            var checkList = $scope.CheckedId.split(",");
            $scope.a += dat.id;
            var index = checkList.indexOf($scope.a);


            checkList.splice(index, 1);
            $scope.CheckedId = "";

            for (var i = 0; i < checkList.length; i++) {
                if ($scope.CheckedId.length == 0) {
                    $scope.CheckedId = checkList[i];
                } else {
                    $scope.CheckedId += "," + checkList[i];
                }
             }
        }

There is an error in my check function here. When I deselect and add another value, it comes with the previous selected value. How do I fix it so it doesn't happen? I've been trying for a while, but I couldn't. I would be glad if you help.

标签： javascriptc#angular