angularJS的自定义过滤器内的无限摘要循环

Question

我正在显示一个表格列表，并且每一行也是可展开的。我想使用可扩展表的属性过滤列表。例如，如果主表显示学生的一般信息，可扩展表显示该学生的科目分数。我想按标记列过滤完整的表格。所以过滤应该显示带有匹配标记的父表。

var students = [{ 
   name: "neha",
   address: "abc"
   marks: [{
      subject: "english",
      marks: 80
   }, {
      subject: "hindi",
      marks: 60
   }]
 }, { 
   name: "sneha",
   address: "xyz"
   marks: [{
      subject: "english",
      marks: 70
   }, {
      subject: "math",
      marks: 50
   }]
 }

为此 我正在使用自定义过滤器来过滤列表。在自定义过滤器中，我使用“filterFilter”来过滤标记数组。

filterBy 是跟踪属性的属性，值将被测试。

例如，这些值可以是 1) filterBy = {property: "marks.subject", value: "hindi"} //过滤嵌套表

2) filterBy = {property: "name": value: "neha"} //过滤父表

var app = angular.module("MyApp", []);
app.filter("filterTable", function(filterFilter) {

    return function(list, filterBy) {
        var filteredList = [],
            len,
            i,
            j,
            property,
            present,
            tempList,
            listCopy,
            properties = [];

        //creating a copy as filter will update the list and rest filter will not work properly
        listCopy = angular.copy(list);
        len = listCopy.length;

        if(filterBy.value) {

            properties = filterBy.property.split(".");

            //if filter on nested table
            if(properties.length > 1) {
                property = properties[1];

                for ( i = 0; i < len; i++) {
                    tempList = {};
                    //using filterFilter defined by angularjs
                    listCopy[i].disks = filterFilter(list[i].disks, { [property] : filterBy.value });
                    console.log(list[i].disks);
                    if(listCopy[i].disks.length) {
                        filteredList.push(listCopy[i]);
                    }  

                }
            } else {
                property = filterBy.property;

                for ( i = 0; i < len; i++) {

                    if(list[i][property].indexOf(filterBy.value) > 0) {
                        filteredList.push(list[i]);
                    }
                }
            }

            return filteredList;
        } else {
            return list;
        }
    };
});

但这会进入无限的消化循环。我花了很长时间解决这个问题，仍然无法解决。请帮帮我。 提前致谢。

Answer 1

这是因为你是deep copy 数组。

Angular 的 ngRepeat 没有意识到这些对象是相等的，因为 ngRepeat 通过身份跟踪它们。新对象导致新身份。这使得 Angular 认为自上次检查以来发生了一些变化，这意味着 Angular 应该运行另一次检查（也称为摘要）。

尝试不使用angular.copy()的过滤器更新逻辑

更新：

用flat copy代替angular.copy：

var newArray= oldArray.slice(); // 克隆数组并返回对新数组的引用。