Angular JS - NG-重複過濾器和groupBy

我正在構建一個儀表板來顯示ogoing和已關閉的問題。我得到了一切與角度的ng-重複使用過濾器和按日期分組。這裏是什麼，我走到這一步，快速樣品：Angular JS - NG-重複過濾器和groupBy

<div ng-app="myApp"> 
     <div ng-controller='TestGroupingCtlr'> 
      <div ng-repeat="item in MyList | filter: {status: 'Closed'} | groupBy:'groupfield' " > 
       <h2 ng-show="item.groupfield_CHANGED">{{item.groupfield}}</h2> 
       <ul> 
        <li>{{item.whatever}} - Status: {{item.status}}</li> 
       </ul> 
      </div> 
     </div> 
</div>

我的繼承人範圍數組：

$scope.MyList = [ 
    {groupfield: 'Day Before', whatever: 'Server X down', status: 'Open'}, 
    {groupfield: 'Yesterday', whatever: 'Access issues', status: 'Open'}, 
    {groupfield: 'Yesterday', whatever: 'Server Z is down', status: 'Closed'}, 
    {groupfield: 'Today', whatever: 'Network problem', status: 'Closed'}, 
    {groupfield: 'Today', whatever: 'Network is down', status: 'Closed'} 
];

我的jsfiddle樣本： http://jsfiddle.net/R8YZh/6/

我的問題是我需要的情況下，仍打開只顯示在今日組下。從技術上講，我可以簡單地創建一個新的ng-repeat，僅顯示開放問題並在我的第一個列表中顯示正確。但由於我有一個非常大的模板，其中有很多問題的細節，我想避免2維護2個模板。

會有人知道，如果有一種方法簡單地使用現有的吳重複，並告訴是顯示所有打開的問題在索引陣列，它發現自己在今天的小組莫名其妙的結束了嗎？任何幫助表示讚賞。

這就是我希望將顯示：

Yesterday 

Server Z is down - Status: Closed 

Today 

Network problem - Status: Closed 
Network is down - Status: Closed 
Server X down - Status: Open 
Access isses - Status: Open

來源

2016-11-18 Daniel Ellison

它可能會更容易應用的篩選到li元素水平，而不是在集團層面

<div ng-app="myApp"> 
     <div ng-controller='TestGroupingCtlr'> 
      <div ng-repeat="item in MyList | groupBy:'groupfield' " > 
       <h2 ng-show="item.groupfield_CHANGED">{{item.groupfield}}</h2> 
       <ul > 
        <li ng-show="item.status=='Closed' || item.groupfield=='Today' ">{{item.whatever}} - Status: {{item.status}}</li> 
       </ul> 
      </div> 

     </div> 

</div>

來源

2016-11-18 23:49:51

感謝安東尼落得這樣做類似於你所提到的東西做的。 –

當你調用過濾器，如documentation說，「最終的結果是，謂詞返回真正的那些元素的數組。」，這是，不會包含任何狀態爲「打開」的項目。

這意味着你應該做的是另NG-重複表明是「開放」的人。它可能不會太影響性能，但是，如果你不想保持速度和組織性，請考慮使用分頁。如果你不想使用另一個ng-repeat或paginate，你也可以創建自己的自定義過濾器。

來源

2016-11-18 23:23:50 mcrvaz

Angular JS - NG-重複過濾器和groupBy

回答

相關問題