如果子/嵌套重复具有值，则隐藏ng-repeat

Question

我有多个ng-repeats，彼此依赖。

$scope.niveaus = [
        { niveau: 'a' },
        { niveau: 'b' },
        { niveau: 'c' },
        { niveau: 'd' },
        { niveau: 'e' },
        { niveau: 'f' },
        { niveau: 'g' }
    ];

    $http.get('/goals.json').success(function(goals) {
        $scope.goals = goals;
    });

我填写了硬编码的niveau A-G。在目标列表中，我将niveaus的名称与JSON中的名称相匹配。

并做一个ng-repeat：

<ul ng-repeat="niveau in niveaus">

        <li class="foobar">{{ niveau.niveau }}</li>

        <div ng-repeat="goal in goals | unique:'niveau_id'">
            <div ng-if="goal.niveau.name == niveau.niveau">
                <li class="yes">{{ goal.niveau.name }}</li> 
            </div>
        </div>

    </ul>

所以它检查每个niveau的目标。如果目标与名称匹配，则会显示。 但现在的问题是，如果ng-if中存在匹配，也会显示li.foobar。

所以这可以是输出：

但它应该有独特的niveau名字。每行 A-G 。并显示重复部分中是否存在li.yes，它应该从重复列表中隐藏li.foobar。

但是如何在Angular中实现呢？

Answer 1

检查filters

上的文档

angular.module('myApp', []).filter('withgoals', function() {
return function(input, goals) {
  var out = [] 
  for (var i = 0; i < goals.length; i++) {
    if (input.niveau == goals[i].niveau.name) out.push(input[i])
  }
  return out;      
});


<div ng-repeat='n in niveaus| withgoals: goals'></div>