我正在尝试将属性动态分配给iron-ajax
模板,但它解析为未定义。
<dom-module id="products-service">
<style>
:host {
display: none;
}
</style>
<template>
<iron-ajax id="productsajax"
auto
url="http://localhost:3003/api/taxons/products"
params='{"token":"my-token"}'
method='GET'
on-response='productsLoaded'
handleAs='json'>
</iron-ajax>
</template>
</dom-module>
<script>
(function() {
Polymer({
is: 'products-service',
properties: {
categoryid: {
type: String,
notify: true,
reflectToAttribute: true
}
},
//here I am trying to add and `id` to the `iron-ajax` `params` attribute.
ready: function() {
this.$.productsajax.params.id = this.categoryid;
}
});
})();
</script>
生成的 url 如下所示:
`http://localhost:3003/api/taxons/products?token=my-token&id=undefined`
的属性不是我可以看到反映在属性上dom-module
的正确属性值,这意味着它与如何将其分配给属性有关。我也在和回调上尝试过这个,但仍然无法正常工作。categoryid
undefined
created
attached
编辑:categoryid
像这样实例化它时传递给模块:
<products-service products="{{products}}" categoryid="{{categoryid}}"></products-service>
如此处所示,categoryid
传递给服务的值已经具有值。(图像上的元素名称可能略有不同。我缩短了它们以使问题不那么冗长。)
category-products-list
调用服务的位置如下所示
<dom-module id="category-products-list">
<template>
<category-products-service products="{{products}}" categoryid="{{categoryid}}"></category-products-service>
<div>
<template is="dom-repeat" items="{{products}}">
<product-card on-cart-tap="handleCart" product="{{item}}">
<img width="100" height="100">
<h3>{{item.name}}</h3>
<h4>{{item.display_price}}</h4>
</product-card>
</template>
</div>
</template>
</dom-module>
<script>
(function() {
Polymer({
is: 'category-products-list',
properties: {
categoryid: {
type: String,
notify: true,
reflectToAttribute: true
}
},
ready: function() {
//this is undefined too
console.log("categoryid in the list module: "+categoryid)
}
});
})();
</script>