2017-09-29 20 views
0
<link rel="import" href="../../bower_components/polymer/polymer-element.html"> 
    <dom-module id="my-data"> 
     <script> 
     (function() { 
     let dataValue = [ 
      {num: 'T001', status: '4', bground: 'num-sub'}, 
      {num: 'T002', status: '4', bground: 'num-sub'}, 
      {num: 'T003', status: '4', bground: 'num-sub'}, 
     ]; 
    class MyData extends Polymer.Element { 
     static get is() { return 'my-data'; } 
     static get properties() { return { 
     data: { 
      type: Array, 
      value: dataValue, 
      readOnly: true, 
      notify: true 
     } 
     }} 
    } 
    window.customElements.define(MyData.is, MyData); 
     })(); 
     </script> 
    </dom-module> 

私は上記のようにカスタム要素my-data.htmlを作成します。 次に、my-app.htmlの使い方を示します。 マイデータが表示される可能性がありますが、my-app.htmlはdata: Arrayプロパティのmy-dataの情報を取得できません。ポリマーカスタムデータコンポーネントがデータを送信できない理由

<my-data data="{{data}}"></my-data> 
    <dom-repeat items="{{data}}" as="entry"> 
     <template> 
     <my-num entry="[[entry]]" ></my-num> 
     </template> 
    </dom-repeat> 
</template> 
    <script> 
    class MyApp extends Polymer.Element { 
     static get is() { return 'my-app'; } 
     static get properties() { 
     return { 
      data: { 
      type: Array, 
      } 
     } 
     } 
    } 
    window.customElements.define(MyApp.is, MyApp); 
    </script> 
+0

ですか? dom-repeatポリマー管理テンプレートの使用方法については、https://www.polymer-project.org/2.0/docs/devguide/templates#dom-repeatを参照してください。たとえばhttps://codepen.io/johnthad/pen/zEzVLmを参照してください。 – Thad

+0

'my-data'の配列やオブジェクトのデータを変更する場合は、親要素に通知する必要があります。これは、 'this.set( 'data'、dataValue)'のように、Polymerの 'this.set(...)'を使って扱うことができます。おかげで、my-data要素がレンダリングされる可能性がありますが、他の要素はまだmy-data要素から情報を取得できません。https://www.polymer-project.org/2.0/docs/devguide/model-data#set-path –

答えて

0

あなたはmy-app.html最初にmy-data.htmlmy-num.htmlをインポートする必要があります。

例:

<link rel="import" href="my-data.html"> 
<link rel="import" href="my-num.html"> 

また、my-num.htmldom-moduleid名前はmy-nameないkvs-numでなければなりません。

dom-repeatmy-app.htmlにインポートしてください。これは、それが

<link rel="import" href="../../bower_components/polymer/lib/elements/dom-repeat.html"> 

Demo here

+0

データのデータプロパティ。 – Jayly

+0

それは 'my-app.html'でどうやってやっているのですか?それは別の質問になるか、あなたの質問を編集して私に知らせてください。 – Ofisora

+0

申し訳ありませんが、質問が更新されました。 – Jayly

関連する問題