Question

我有两个custom elements，一个有客户列表（customer-list），另一个应该加载选定客户的送货地址（shipping-address）。 AJAX调用绑定customer-list中的客户列表。当我点击客户时，列表将根据e.model.customerid进行过滤并创建新阵列。然后我将其分配给shipping-address元素中的自定义属性。

因为客户可能有多个送货地址，我使用dom-repeat绑定它们。这就是我想要的：

让dom-repeat模板通过我在shipping-address元素中声明的函数进行绑定，而不是自动绑定。我想在点击一个客户后调用此函数，记录集被过滤并分配给该元素的自定义属性。
我想从我的customer-list元素中调用该函数。

这是我到目前为止所尝试的：

customer-list

_passCustomerIdToGetAdditionalShippingAddress: function (e) {
  var addlShipAddress = document.querySelector("#shipAddl");
  if (addlShipAddress != null) {
    //Filter rows from JSON data based on this customer Id
    //and set the new Array to additional-shipping element's customers property!

    var selectedCustomerId = e.model.item.id;

    //Now filter.....
    var customerId;
    addlShipAddress.fiteredCustomers = [];

    for (var i = 0; i < this.customers.length; i++) {
      customerId = this.customers[i].id;
      if (customerId != selectedCustomerId) continue;
      addlShipAddress.fiteredCustomers.push(this.customers[i]);
      document.querySelector("#shipAddl").bindData();
      break;
    }

    addlShipAddress.customerId = e.model.item.id;
  }
}

shipping-address

<dom-module id="additional-shipping-address">
  <template>
    <style>
        :host
        {
            display: block;
        }
    </style>
      <div id="testd">{{fiteredCustomers}}</div>
      <template is="dom-repeat" items="{{fiteredCustomers}}">
          
      </template>
  </template>
    <script>
        (function () {
            'use strict';

            Polymer({
                is: 'additional-shipping-address',

                properties: {
                    fiteredCustomers: {
                        type: Array,
                        value: [],
                        notify: true
                    },

                    customerId: {
                        type: String,
                        notify: true
                    }
                },

                bindData: function () {
                    alert("I have called from outside with value: " + value);
                }
            });
        })();
    </script>
</dom-module>

控制台错误显示document.querySelector("#shipAddl").bindData(); is not a function
我不知道如何通过函数绑定dom-repeat。我提到this帖子。

请帮忙。

提前致谢。

Answer 1

如果我理解正确，<shipping-address>位于<customer-list>的模板内。如果这样那么你就无法调用模板内的元素（＆＃39;＃shipAddl＆＃39;）来自地方模板的dom-repeat正在运行。可能有多个<shipping-address>标签具有相同的ID，甚至没有可能引发问题的标签。

Polymer 1.0 - 如何使dom-repeat工作在函数调用上

1 个答案: