通過使用自定義過濾器嵌套ng重複進行過濾

Question

看起來像自定義過濾器是我在這裏追求的。在篩選出元素時，我正在尋找特定的行爲。我正在尋找一個統一的搜索欄來返回所有匹配的組名，並且所有學生沒有進行組名匹配，組名匹配的學生。

Here's my plunker with all the code

例如，通過搜索「ER」的結果應該是「招潮蟹」和「火熱的船長」，而是「金熊」的整個上市應該只顯示德魯·帕克和埃裏克。

plunkr當前演示默認的過濾器行爲。如果將HTML中的過濾器更改爲我的自定義過濾器，即第27行的nestFilter，並且遵循控制檯日誌，則可以看到返回的數組正在更新，但添加和刪除了搜索項，但元素未被重繪。這裏是我的過濾器

bootTracker.filter('nestFilter', function() { 

    return function(elements, input) { 

    var filteredCohorts, filteredCohortsStudents; 
    filteredCohorts = []; 
    filteredCohortsStudents = []; 

    console.log(elements); 

    angular.forEach(elements, function(cohort) { 

    var matchedStudents; 
    matchedStudents = []; 

    if (cohort.name.match(new RegExp(input, 'ig'))) { 
     filteredCohorts.push(cohort); 
    } 

    angular.forEach(cohort.students, function(student) { 
     if (student.name.match(new RegExp(input, 'ig'))) { 
     return matchedStudents.push(student); 
     } 
    }); 

    cohort.students = matchedStudents; 
    if (cohort.students.length > 0) { 
     return filteredCohortsStudents.push(cohort); 
    } 
    }); 

    console.log(filteredCohorts); 
    return filteredCohorts; 
}; 
}); 

Answer 1

有幾個問題你nestFilter，其中之一是，你是修改原來的陣列（設置cohort.students = matchedStudents）。

這裏的nestFilter（see this Plunker for a demo）的工作版本

bootTracker.filter('nestFilter', function() { 
    return function(elements, input) { 
    var filteredCohorts = []; 
    console.log(elements); 
    angular.forEach(elements, function(element) { 
     if (element.name.match(new RegExp(input, 'ig'))) { 
     filteredCohorts.push(element); 
     } else { 
     var matchedStudents = []; 
     angular.forEach(element.students, function(student) { 
      if (student.name.match(new RegExp(input, 'ig'))) { 
      matchedStudents.push(student); 
      } 
     }); 
     if (matchedStudents.length > 0) { 
      var cohort = angular.extend({}, element); 
      cohort.students = matchedStudents; 
      filteredCohorts.push(cohort); 
     } 
     } 
    }); 
    console.log(filteredCohorts); 
    return filteredCohorts; 
    }; 
});