应用程序路由的聚合物传递数据到自定义元素未定义

Question

我正在尝试将应用程序路由参数传递给未定义的自定义元素。我可以在文件中显示该参数，但在自定义元素中，它未定义。以下是我的代码，请帮助我检查如何修复它。谢谢

在自定义元素文件中，getid 未定义。

我的文件

<app-route
    route="[[route]]"
    pattern="/:slug/:id"
    data="{{routeData}}"></app-route>

    <!-- display correctly -->
    [[routeData.id]]

<myelement-http-get
    id="getCategoryData"
    getid="[[routeData.id]]"
    geturl="http://localhost:9000/polymer/category/"
    jsonobject="{{jsonobject}}"
    failure="{{failure}}"></myelement-http-get>

自定义元素

<script>
  Polymer({
      is: 'myelement-http-get',

      properties: {
        geturl: String,

        getid: String,

        jsonobject: {
          type: Object,
          notify: true
        },

        failure: {
          type: Boolean,
          notify: true,
          readOnly: true
        }

      },

      ready: function () {
        /* undefined found this.getid */
        this.$.ajaxData.url = this.geturl + this.getid;
        this.$.ajaxData.generateRequest();
      },

      handleResponse: function (data) {
        this.jsonobject = data.detail.response;
      }
  });
</script>

Answer 1

getid 和 geturl 的数据绑定效果发生在 ready 回调之后，所以这不是您想要的操纵这些属性。

相反，您应该使用 complex observer 来观察 getid 和 geturl。只有在定义和更改两个属性时才会调用此观察器（此行为在 Polymer 2.0 中略有变化）。

您应该删除 ready 中的更改，并添加如下所示的复杂观察器：

Polymer({
  ...

  properties: { ... },

  observers: ['_generateRequest(geturl, getid)'],

  _generateRequest: function(geturl, getid) {
    if (geturl && getid) {
      this.$.ajaxData.url = geturl + getid;
      this.$.ajaxData.generateRequest();
    }
  }
);

应用程序路由的聚合物传递数据到自定义元素未定义

Polymer pass data of app-route to custom element gone undefined

javascript

polymer

polymer-1.0