使用Angular ng-repeat过滤器返回隐藏的对象

我正在尝试显示组的第一个值，并在ng-repeat中隐藏所有其他类似的值。我得到的if/else工作，但它字面上返回“假”作为一个字符串。这是我到目前为止。使用Angular ng-repeat过滤器返回隐藏的对象

app.filter('dateSort', function() { 
    var prevVal = null; 
    return function(input) { 
    if (prevVal !== input.uniquedate) { 
     prevVal = input.uniquedate; 
     return moment(input.jsdatetime).format('dddd,\n MMMM Do'); 
    } else { 
     return false; 
    } 
    };

}）;

我也试过这个作为指令，但没有运气。

app.directive('hideon', function() { 
var prevVal = $index[-1].uniquedate; 
return function(scope, element, attrs) { 
    scope.$watch(attrs.hideon, function(value, oldValue) { 
     if(element.uniquedate !== prevVal) { 
      element.show(); 
     } else { 
      element.hide(); 
     } 
    }, true); 
}

}）;

任何帮助表示赞赏。我假设做这件事的最好方法是使用指令。对于带有返回对象（包括false）的过滤器本身，在对任何数据进行排序后，这些值不会成立。那时我开始尝试与$ watch一起使用它。

这里有一个Codepen什么我started- http://codepen.io/drewbietron/pen/dKjhe

来源

2014-10-30 Drewbietron

不ngHide/ngShow/ngIf不行？ – TheSharpieOne 2014-10-30 19:58:11

@TheSharpieOne我试过这个没有成功的多个版本。过滤器功能可以工作，但在过滤器被调用后不会更新。我还需要该元素完全从DOM中消失，因为该元素具有CSS填充 - 一个空白框仍显示没有内容。 – Drewbietron 2014-10-30 20:15:00

这里是修复到空白框显示。

app.filter('uniqueDate', function() { 
var prevVal = null, prevSeq = null; 
return function(input, seq) { 
    input.show = false; 
    if (prevVal !== input.month || prevSeq == seq-1) { 
    prevVal = input.month; 
    input.show = true; 
    return input.day + " " + input.month; 
    } 
}; 
});

已经进行了代码更改以筛选选择类型的事件。

 var selectedTypes = ["Math", "Science", "Writing"]; 
     $scope.updateSelectedTypes = function(type){ 
     var found = _.some(selectedTypes, function(selType){ 
      return selType == type; 
     }); 
     if(!found){ 
      selectedTypes.push(type); 
     } 
     else{ 
      selectedTypes = _.difference(selectedTypes, type); 
     } 
     filterEvents(); 
     }; 

     var filterEvents = function(){ 
     var result = _.filter(Events, function(event){ 
      return _.some(selectedTypes, function(type){ 
      return event.type == type; 
      }); 
     }); 

     result = _.each(result, function(item){ 
      item.show = false; 
     }); 
     $scope.events = angular.copy(result); 
     };

HTML：

<li><b>Filter By:</b></li> 
<li class="filter" ng-click="updateSelectedTypes('Math')" ng-class="{ active: Math }">Math</li> 
<li class="filter" ng-click="updateSelectedTypes('Science')" ng-class="{ active: Science }">Science</li> 
<li class="filter" ng-click="updateSelectedTypes('Writing')" ng-class="{ active: Writing}">Writing</li> 
<input type="search" ng-model="instructor.instructor" placeholder="Search By Instructor..." />

这里是更新codepen link

来源

2014-10-30 22:10:53

对不起，延误了，昨天没有花时间。 – 2014-10-30 22:11:34

使用Angular ng-repeat过滤器返回隐藏的对象

回答

相关问题