2016-12-21 3 views
0

私はanglejs 1.5でコンポーネントをセットアップしました。私は私のプロジェクトリストからいくつかの値を示す列を持つスマートなテーブルを持っています、そして、私はこれらの値の合計を上に示すことができるようにしたいと思います。プロジェクトリストリソースクエリのコールバックを実行してすべての値を調べることができますが、ユーザーがスマートテーブルのフィルタリング検索で除外した内容に基づいて値を設定する必要があります(つまり、テーブルに3行残っている場合ユーザーがst-検索条件でこの列に3/3,2/5、および4/5の値を入力した後、上部に「Total assigned:9/13」という行を表示したい。AngularJS 1.5コンポーネントを使用したカスタムスマートテーブルのマニフェスト

私のコードの簡略化されたバージョンはこれまでのところです。

コンポーネント:

angular.module("projectList", ['smart-table']).component('projectList', { 
    templateUrl: '/projectList.template.html', 
    controller: ['project', function projectListController() { 
     this.$onInit = function() { 
      this.projects = project.query(); 
     } 
    }] 
}); 

projectList.template.html:

<table st-table="st_projects" st-safe-src="$ctrl.projects" class="table table-striped"> 
    <thead> 
     <tr> 
      <th><input type="text" class="form-control" st-search="" placeholder="Search..."></th> 
     </tr> 
     <tr> 
      <th colspan="0"> 
       <div st-template="/totalResults.template.html" st-pagination=""></div> 
      </th> 
     </tr> 
     <tr> 
      <th st-sort="name" st-sort-default="true" st-skip-natural="true" class="sort-table-header"> 
       Name 
      </th> 
      <th> 
       Assigned 
      </th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="project in st_projects"> 
      <td>{{project.name}}</td> 
      <td>{{project.assigned_spots}}/{{project.team_spots}}</td> 
     </tr> 
    </tbody> 
    <tfoot> 
     <tr> 
      <td colspan="0"> 
       <div st-pagination="" st-items-by-page="10" st-displayed-pages="7"></div> 
      </td> 
     </tr> 
    </tfoot> 
</table> 

totalResults.template.html

<div style="text-align:right">Total Results: {{totalItemCount}}</div> 

私は

require: { parent: '^stTable' } 
を追加しようとしました

を私のコンポーネントに追加しますが、コントローラの親値は未定義のままです。また、私の追加のテンプレート(totalResults.template.html)がスマートテーブルのスコープにアクセスできるように思われますが、そこから計算を行う方法がわかりません。特に、関数から来る値を合計する必要がある私の元のprojectListControllerの代わりに、プロジェクトリストから直接。割り当てられた/開いている合計の値はどのように計算されますか?

答えて

0

thisスマートテーブルを使用した改ページの指示を試してください。私はこれを使用しました。それは、現在、最後、合計、範囲のようなオプションがたくさんあり、あなたは自分の要件に応じて使いやすいテンプレートを変更することもできます。

関連する問題