2016-05-12 8 views
1

実行時にポリマーの挙動を設定する必要があります。私は新しい振る舞いを押して "振る舞い"配列を変更しようとしましたが、うまくいきませんでした。それを行う適切な方法はありますか?ポリマー:実行時に挙動を登録する

私は、ページャを下にしてテーブルのWebコンポーネントを作成しようとしています。それは、javascript配列、安らかなサービスまたはカスタムソースからのデータのロードを可能にする拡張可能でなければなりません。したがって、これらのソースごとに動作を作成し、ソースが変更されたときに変更することにしました。それを設計する正しい方法ですか?

例として、アレイからデータをロードする動作のthe source codeを示します。それは次の機能を持っています:

itemsLoad: function(page, itemsPerPage, callback) {... 

特定のページのデータを読み込むためにWebコンポーネントから呼び出されます。私の考えは、データソースの種類(CSV、JSONなど)に基づいたそれぞれの動作が、この方法を別の方法で実装することです。実行時には、開発者がどちらを使用するかを知っているため、動作は実行時に登録されます。

答えて

1

動作プロトタイプに混在しているため、動作時に動作を変更することはできません。

あなたのケース(csv、jsonなど)ごとに別々の要素を作成し、必要に応じてノードを動的に作成することができます。あなたはよりあなたのグリッド

<table-component> 
    <json-data-source></json-data-source> 
</table-component> 

<table-component>は、データを取得するためにitemsLoadを実装し、子要素を探します内側にその要素を置くことができます。あなたがPolymer's DOM APIを使用することになり、子ノードで動作するように

EDIT

。たとえば、追加された子ノードをリッスンし、itemsLoadメソッドを実装する子ノードを選択できます。

Polymer({ 
    attached: function() { 
    Polymer.dom(this).observeNodes(function(info) { 
     var newNodes = info.addedNodes; 

     for(var i=0; i<newNodes.length; i++) { 
     var dataSource = newNodes[i]; 

     if(dataSource.itemsLoad && typeof dataSource.itemsLoad === 'function') { 
      this.loadItems(dataSource); 
      break; 
     } 
     } 
    }); 
    } 

    loadItems: function(dataSource) { 
    dataSource.itemsLoad().then(...); 
    } 
}); 

あなたはPolymer.dom(this).children上で単に反復してPolymer.dom(this).observeNodesを置き換えることができます。いずれにしてもあなたにとって最適です。

+0

ご返信ありがとうございます。子要素を検索し、itemsLoadを実装するかどうかを判断するにはどうすればよいですか? –

+0

Polymerでは、基本的には通常のDOM操作とほとんど同じです。要素が機能を実装しているかどうかを確認しますか?存在するかどうかを確認してください。更新された回答を見る –

関連する問題