Angular JS数据过滤使用复选框

时间:2016-05-03 22:55:01

标签: javascript angularjs

我正在使用Angular JS过滤表中的数据(使用数组)。有两个数组originalData和filteredData,都初始化为同一个东西。 UI中的复选框初始化为true(因此显示表的所有数据)。当我单击复选框取消选中它时,相应地删除数据以使该部分有效。我重新单击复选框进行检查,它确实将数据插回,但是它采用了默认的原始数据值,表格中有重复数据(原始数据+复选框中的重复数据)。我的问题是为什么过滤后的数据没有存储?

//using ng-change in Angular for checkboxes (changeData function)

var originalData = miss_info;
var filteredData = miss_info;

$scope.changeData = function(requester){
    var t_requester = requester.ticketRequester;



    if(requester.status){
        //inserted filteredData back
        for(var i in originalData){
                if(t_requester == originalData[i].Requester){
                        filteredData.unshift(originalData[i]);
                }
                }
            }
    else{
        //remove from filtered data
        for(var i in filteredData){
                if(t_requester == filteredData[i].Requester){
                        filteredData.splice(i,1);           
                }
        }
    }   

    console.log(filteredData);      
    $scope.missInfo = filteredData;
};

该表正在观察变量missInfo以进行更改和更新。

下面的复选框逻辑:

   $scope.requesterTemps=[
              {'name': "BlahA",
               'ticketRequester': 'a',
               'status': true
               },
              {'name': "blahB",
               'ticketRequester':'b',
               'status': true
               },
              {'name': "blahc",
               'ticketRequester': 'c',
               'status': true
               },
              {'name': "blahd",
               'ticketRequester': 'd',
               'status': true
               },
              {'name': "blahe",
               'ticketRequester': 'e',
               'status': true
               },
              {'name': "Other",
               'ticketRequester':'other',
               'status': true
               }
             ];

这是html(表格未显示):

<div class="checkbox">
  <label ng-repeat="requester in requesterTemps">
    <input type="checkbox" ng-model="requester.status" ng-change="changeData(requester)"/>{{requester.name}}
  </label>
</div>
<table st-table="displayed" st-safe-src="missInfo" class="table table-striped"></table>

0 个答案:

没有答案