2017-05-15 6 views
0

私は一連のテーブル行を生成するng-repeatを持っています。 1つの列には「タスクステータス」というタイトルが付けられており、ステータスが「完了」と表示されている場合は、ジョブが完了したので表示されません。AngularJS ng-repeatの隠しテーブル行を無視してインクリメントを保持する方法はありますか?

私はng-show = values!= 0を使用しました。これは最初に増分を追加してタスクに番号を付けるまで機能しました。

私が見つけたのは、data = "done"はDOMから完全に削除されず、リスト内でまだ増分を中断していたということでした。だから、行2及び3は、 "完了" と等しくなるデータであり、

list increment disruption

:下の画像を参照してください。私はそれらを無視するために何ができますか?ここで

が私のマークアップです:

<table class="backlog table table-bordered table-striped" width="100%" border="0" cellpadding="0" cellspacing="0" summary="Our Jira Backlog"> 
     <tbody> 
     <tr> 
      <th>Priority</th> 
      <th>Task Priority Score</th> 
      <th>Task Summary</th> 
      <th>Due date</th> 
      <th>Task Status</th> 
     </tr> 
     <tr ng-repeat="issue in issues | orderBy: '-fields.customfield_12401'" ng-if="issue.fields.status.statusCategory.name != 'Done'"> 
     <td>{{ $index + 1 }}</td> 
     <td>{{ issue.fields.customfield_12401 }}</td> 
     <td>{{ issue.fields.summary }}</td> 
     <td>{{ issue.fields.customfield_13700 }}</td> 
     <td>{{ issue.fields.status.statusCategory.name }}</td> 
     </tr> 
     </tbody> 
    </table> 

だから、「issue.fields.status.statusCategory.name」から来ているものは1,2,3、優先順位(第一列)が入るので、無視する必要があります、4,5等を表示し、タスクステータスカラムを表示しません。

+0

これは、テンプレートの問題ではありません。問題の値を設定するときは、コントローラまたはディレクティブで優先度を計算する必要があります。テンプレートでビジネスロジックを行うのは避けてください。 – cgTag

+0

私はあなたが何をしているのか分かりません。あなたは特定の行をスキップしますが、スキップされた行に対して '$ index'をインクリメントしますか? –

+0

テンプレートに渡す前にデータをフィルタリングします。 –

答えて

1

私はこの状況を処理する最善の方法は、まずフィルターを配列にすることだと思います。配列をng-repeat式ですべてフィルタリングできます。必要に応じて、テンプレートで参照できる変数を保持するだけです。

このSO質問への答えチェックアウト:AngularJS - how to get an ngRepeat filtered result reference

編集:

:私はあなたがカスタムフィルタにあなたのNG-IFを変更し、NG-リピートインデックス前に濾過配列を、それを適用すべきだと思う明確にします
<tr ng-repeat="issue in (filteredIssues = (issues | orderBy: '-fields.customfield_12401' | filter: customFilterFunction))"> 

    <td>{{ $index + 1 }}</td> 
0

あなたのng-ifフィルターとして維持してもインクリメント保つことができるはずですあなたの$index単にあなた$indexng-repeattrack byように移動することによって:

<tr ng-repeat="issue in (issues | orderBy: '-fields.customfield_12401') track by $index" ng-if="issue.fields.status.statusCategory.name != 'Done'"> 

は、が実装されていても、for-eachのインデックスと一致する必要があります。

更新日:あなたの質問は間違っていると思います。 $indexに「完了」行をスキップしてもらいたいですか?それは明確ではありませんでした...

@ Ericson578が示唆しているように、filterをカスタム化して配列から「完了」行を削除する必要があります。

<tr ng-repeat="issue in ((issues | removeDoneRows) | orderBy: '-fields.customfield_12401') track by $index" > 

...とあなたremoveDoneRowsフィルタ(こののためのより良い名前を思い付くしてください):

angular.module('myFilter', []) 
.filter('removeDoneRows', function() { 
    return function(arr) { 
     var retval = []; 
     for(var i = 0; i < arr.length; i++){ 
      if(arr[i].fields.status.statusCategory.name.toLowerCase() != "done") 
       retval[retval.length] = arr[i]; 
     } 
     return retval; 
    }; 
}) 
関連する問題