angularJS自定義過濾器中的無限摘要循環

我正在顯示一個表的列表，每行也是可擴展的。我想使用可擴展表的屬性來過濾列表。例如，如果主表顯示學生的一般信息和可擴展表格顯示該學生的主題標記。我想通過標記列過濾完整的表格。所以過濾應該顯示帶匹配標記的父表。angularJS自定義過濾器中的無限摘要循環

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 = {屬性：「marks.subject」，值：「印地文」} //對嵌套表

2）filterBy = {屬性過濾器：「姓名」：值：「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; 
     } 
    }; 
});

過濾但這是進入無限循環消化。我花了很長時間在這方面仍然無法解決。請幫助我。在此先感謝。

來源

2017-03-29 Neha Gupta

發生這種情況是因爲你是deep copy數組。

Angular的ngRepeat沒有意識到這些對象是相等的，因爲ngRepeat通過身份來追蹤它們。新對象導致新身份。這使得Angular認爲自從上次檢查以來發生了一些變化，這意味着Angular應該運行另一個檢查（又名摘要）。濾波器的

嘗試更新邏輯而不angular.copy()

更新：

代替angular.copy使用flat copy：

var newArray= oldArray.slice(); //克隆陣列，並返回參照新的數組。

來源

2017-03-29 17:24:40

如果我沒有使用angular.copy，那麼它修改列表。因此，下一個過濾器操作將無法正常工作，因爲列表已更新，所以它正在更新的列表上工作，因爲值是通過引用複製的 –

已更新的答案，嘗試使用陣列的「平面副本」 –

如果我只是將其複製平坦，它仍然更新列表，並且此後的篩選操作會影響結果。你能否提供一個相同的filddle。 –

angularJS自定義過濾器中的無限摘要循環

回答

相關問題