3

私は進行中および閉鎖の問題を表示するためにダッシュボードを構築しています。私はangleのng-repeatをフィルターで処理し、日付でグループ分けしています。ここで私はこれまで得たものの迅速なサンプルです: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> 

相続人は私の範囲の配列:私のJSfiddleの

$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'} 
]; 

サンプル: http://jsfiddle.net/R8YZh/6/

私の問題は、私はまだ例が必要なことです今日のグループの下にのみ表示されます。技術的には、オープンな問題だけを表示するための新しいng-repeatを作成して、最初のリストの下にそっと押し込めます。しかし、私は問題の詳細がたくさんある非常に大きなテンプレートを持っているので、2つのテンプレートを維持することは避けたい。

既存のNgリピートを使い、インデックス配列の最後にすべての未解決の問題を表示する方法があるのであれば誰でも知っていますか?どんな助けもありがとうございます。

私が望んだものを表示していました。これはされていますdocumentationに言ったように

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 

答えて

2

<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> 
+0

おかげアンソニーはあなたが言及したものと同様のものをやってしまったグループレベルでそれをやってするのではなく、li要素のレベルにフィルタリングを適用する方が簡単かもしれません。 –

1

あなたは、フィルタを呼び出すと、「最終的な結果は、述語がためにtrueを返していること、これらの要素の配列である。」、つまり、ステータスが「開く」のアイテムは含まれません。

つまり、別のng-repeatを実行して「開く」を表示する必要があります。おそらくパフォーマンスにはあまり影響しませんが、速く組織化したくない場合は、ページネーションの使用を検討してください。 本当に別のng-repeatやpaginateを使用したくない場合は、独自のカスタムフィルタを作成することもできます。

関連する問題