如何傳遞數組作爲元素的屬性？

Question

我正在開發發送一個數組作爲元素的屬性。

文件形式-list.html

<dom-module id="form-list"> 
 
    <template> 
 
    <div>{{title}} - {{owner}} </div> 
 
    <form> 
 
     <template is="dom-repeat" items="{{inputAndLabel}}"> 
 
      <div><label>{{item.tag}} {{owner}}</label><input type="{{item.type}}" value="{{item.defaultValue}}"></div> 
 
     </template> 
 
    </form> 
 
    </template> 
 

 
    <script> 
 
    Polymer({ 
 
     is: 'form-list', 
 
     properties: { 
 
     owner: { 
 
      value:"Mechanical", 
 
     }, 
 
     inputAndLabel: { 
 
      type: Array, 
 
      value: function() { return []; } 
 
     } 
 
     }, 
 
     ready: function() { 
 
     this.title = 'Formulario: Usuario'; 
 
     } 
 
    }); 
 
    </script> 
 
</dom-module>

所以，使用元素並通過inputAndLabel propertie（它是一個數組）是不行的，但主人財產的作品（這是一個字符串）。

<form-list inputAndLabel="[ 
     {defaultValue: '', type:'text', tag: 'Nombre' }, 
     {defaultValue: '', type:'text', tag: 'Apellido' }, 
     {defaultValue: '', type:'text', tag: 'Email' }, 
     {defaultValue: '', type:'text', tag: 'Dirección' }]" owner="Eternal"> 
</form-list> 

如何發送數組作爲自定義元素的屬性？

由於

Answer 1

根據polymer documentation可以傳遞數組作爲元素屬性它你尊重嚴格JSON符號。

對於對象和數組屬性可以傳遞的對象或陣列中的JSON格式：

<my-element book='{ "title": "Persuasion", "author": "Austen" }'></my-element>

注意，JSON需要雙引號，如上所示。

<form-list input-and-label='[ 
     {"defaultValue": "", "type":"text", "tag": "Nombre" }, 
     {"defaultValue": "", "type":"text", "tag": "Apellido" }, 
     {"defaultValue": "", "type":"text", "tag": "Email" }, 
     {"defaultValue": "", "type":"text", "tag": "Dirección" }]' owner="Eternal"> 
</form-list> 

還要注意的是corresponding attribute爲inputAndLabel財產寫入input-and-label。