2017-09-29 32 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屬性獲取我的數據信息。爲什麼Polymer自定義數據組件無法發送數據

<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

是這個嗎?請參閱https://www.polymer-project.org/2.0/docs/devguide/templates#dom-repeat關於如何使用dom-repeat聚合物管理的模板。例如,請參閱https://codepen.io/johnthad/pen/zEzVLm。 – Thad

+0

如果你要改變'my-data'中數組或對象的數據,你必須通知父元素。這可以使用Polymer的'this.set(...)'以'this.set('data',dataValue)'的方式處理。請參閱https://www.polymer-project.org/2.0/docs/devguide/model-data#set-path –

回答

0

您需要導入my-data.htmlmy-num.htmlmy-app.html第一。

實施例:

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

此外,id名稱中的my-num.htmldom-modulemy-namekvs-num

導入dom-repeat以及在您的my-app.html

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

Demo here

+0

謝謝,可以呈現my-data元素,但其他元素仍然無法從my-數據的數據屬性。 – Jayly

+0

這取決於你如何在'my-app.html'中做什麼?這將是不同的問題或編輯你的問題,讓我知道。 – Ofisora

+0

對不起,這個問題已經更新。 – Jayly

相關問題