2016-09-13 4 views
12

と呼ばれていません。私は、角流星とngテーブルを使用しています。リファクタリングする前に、データがテーブルに表示されます。ただし、ES6構文にリファクタリングした後は、データは表示されなくなります。ES6角度-流星NG-テーブルのgetData関数は、私はES6に私のコードをリファクタリングしようとしている

class MyController { 
    constructor($scope, $reactive, NgTableParams, MyService) { 
     'ngInject'; 

     $reactive(this).attach($scope); 

     this.subscribe('myCollection'); 

     this.myService = MyService; 

     this.helpers({ 
      items() { 
       return this.myService.getItems(); 
      }, 
      itemTableParams() { 
       const data = this.getReactively('items'); 

       return new NgTableParams({ 
        page: 1, 
        count: 10 
       }, { 
        total: data.length, 
        getData: (params) => { 
         // not called 
        } 
       }); 
      } 
     }); 
    } 
} 

class MyService { 
    getItems() { 
     return MyCollection.find({}, { 
      sort: { 
       dateCreated: -1 
      } 
     }); 
    } 
} 

export default angular.module('MyModule', [angularMeteor, ngTable, MyService]) 
    .component('MyComponent', { 
     myTemplate, 
     controllerAs: 'ctrl', 
     controller: MyController 
    }) 
    .service('MyService', MyService); 

const dataが読み込まなっているが、getDataが呼び出さ取得されていません。これは、リファクタリング、コードのスニペットです。テンプレートの表はng-table属性の値としてctrl.itemTableParamsを使用しており、そのng-repeatitem in $dataです。 getData関数が呼び出されていない理由として

は、誰もがアイデアを持っていますか?ヘルプは非常に高く評価されます。ありがとう!

P.S. 私はconst tableParamsからNgTableParamsを設定し、reload()関数を呼び出し、getDataがトリガされるようにしてください。しかし、それはテーブル上のデータをレンダリングしていないということです。私はgetDataにデータを記録するとき、それはそれでアイテムを持っている

itemTableParams() { 
    const data = this.getReactively('items'); 
    const tableParams = new NgTableParams({ 
     page: 1, 
     count: 10 
    }, { 
     total: data.length, 
     getData: (params) => { 

     } 
    }); 

    tableParams.reload(); // triggers the getData function 
    return tableParams; 
} 


<table ng-table="ctrl.itemTableParams"> 
    <tr ng-repeat="item in $data track by $index"> 
     <td>{{item.id}}</td> 
     <td>{{item.name}}</td> 
     <td>{{item.dateCreated}}</td> 
    </tr> 
</table> 

:私は、としてテーブルを設定します。しかし、私が言ったように、それはテーブルにレンダリングされていません。

+0

コンソールですべてのエラーを取得するのですか?あなたの 'items'メソッドは' this.myService.getItems() 'を呼び出しますが、サービスは' getItems'ではなく 'getInputs'メソッドを持っています。これはちょうど、あなたの実際のアプリにも質問ですか? – noppa

+0

@noppa申し訳ありませんが、それはアプリではなく、質問のタイプミスでした。 – dork

答えて

3

どうやら、あなただけgetDataにデータを返す必要があります。古いドキュメントは$defer.resolveを使用していましたが、解決されたデータは返されませんでした。現在のバージョン(1.0.0)はそれ以上使用していません。

this.helpers({ 
    items() { 
    return this.myService.getItems(); 
    }, 
    itemTableParams() { 
    const data = this.getReactively('items'); 

    return new NgTableParams({ 
     page: 1, 
     count: 10 
    }, { 
     total: data.length, 
     getData: (params) => { 
     const filteredData = filterData(data); // do something 

     return filteredData; 
     } 
    }); 
    } 
}); 
0

dataを非同期にフェッチしますが、同期的に使用するため、getDataメソッドが呼び出されていません。コントローラが最初にロードされると、未解決のデータでgetDataが呼び出されます。

これを修正するには、dataオブジェクトの成功コールバックでNgTableParamsを作成する必要があります:

data.$promise.then((data) => { 
// create NgTableParams here 
}); 
+0

これは 'angular-meteor'に対して有効ですか?私はそれをやろうとしたし、 '$ promise'は未定義です。 – dork

関連する問題