在自定义标记

时间:2016-01-04 09:07:18

标签: polymer



//index.html

<html>
<head>
   <link rel="import" href="test-table.html">
 </head> 
<body>
  <template is="dom-bind" id="index">
     <test-table data="{{data}}" ></test-table>
  </template>
</body>
</html>
&#13;
&#13;
&#13;

&#13;
&#13;
Polymer({
        is: "test-table",
		properties : {
		  data : {type : Array},
          }
    /*I dont know where should I put this stuff
      "queryForIds:"
      "getByIds :"
      "set:"
      "length:0"
   */
    });
&#13;
<dom-module id="test-table">
  <template>
     <paper-datatable-card id="datatableCard" header="Users" page-size="10" data-source="{{data}}" id-property="_id" selected-ids="{{selectedIds}}">
        <paper-datatable id="datatable" data='{{data}}' selectable multi-selection selected-items="{{selectedItems}}">
                    <paper-datatable-column header="Id" property="_id" sortable>
                        <template>
                            <span>{{value}}</span>
                        </template>
                    </paper-datatable-column>
          </paper-datatable>
     </paper-datatable-card>
   </template>
</dom-module>
&#13;
&#13;
&#13;

作为单页面应用程序的一部分我在自己的自定义标记中使用“paper-datatable-card”。我能够显示记录,但我没有得到我必须将代码放入分页的地方。而且我不想一次将所有记录都放入dataSource。 任何帮助表示赞赏, 谢谢, Venkat。

2 个答案:

答案 0 :(得分:0)

在Polymer组件中,您可以使用ready方法设置ready: function() { this.data = { queryForIds: function(sort, page, pageSize){ // implement me }, getByIds: function(ids){ // implement me }, set: function(item, property, value){ // implement me }, length:0 }; }

No build data retrieved. You may need to select a Module.

答案 1 :(得分:0)

您的评论问题:

  

因此我无法将117至133行中的代码放入自定义元素中,因为它不支持dom-bind

答案(在Polymer 2.0中),您可以在组件构造函数中完成所有方法和所有数据变量:

class YourComponent extends Polymer.Element {
    contructor() {
       super();
       //in case if you use paper-datatable-card
       this.data = {
         get: function (sort, page, pageSize) {
                    return new Promise((resolve, reject) => {
                        const exampleData = [
                            { 'name': 'someName1' },
                            { 'name': 'someName2' }
                        ];
                        resolve(exampleData);
                    });
                },
          set: function(item, property, value){...},
          length: 1
       };
       //in case if you use paper-datatable only then without get or set properties
       this.data = [ { name: 'someName' } ];
    }
}