我有一个自定义元素x-custom
,它有一个属性object
,它是一个Object。
我有另一个属性name
,我想用它来 index object
,将来自其他自定义元素的数据放在{{1}的特定属性下}。
以下是最终目标:
object
因此,在示例中,如果<other-custom-element data="{{object.{{name}}}}"></other-custom-element>
...
name: {
type: String,
},
object: {
type: Object,
value: {}
}
的值为&#34; prop1&#34;,那么来自name
的数据将被放入other-custom-element
。
修改
所以,我已经更新了我的代码并且已经接近了一点,但仍然不是很完整。以下示例代码更接近我的实际代码,因此它可能有助于回答问题:
object.prop1
我试图基本上使用<template is="dom-repeat" items="[[locations]]" as="location">
<get-data-at-location
location="[[location]]"
data="[[_resolveRef(location)]]">
</get-data-at-location>
<h5>Data at location: [[location]]</h5>
<template is="dom-repeat" items="[[_resolveRef(location)]]" as="data">
<p>Data: {{data.value}}</p>
<p>Time: {{data.time}}</p>
</template>
</template>
...
alldata: {
type: Object
value: {}
},
_resolveRef: function(location) {
return this.alldata[location];
}
将引用传递给alldata
的特定元素,但我认为可能存在范围问题。我收到以下错误(例如,如果_resolveRef()
等于&#34; some_location&#34;):
location
因此,出于某种原因,它似乎并不知道&#34; alldata&#34;,即使它是自定义元素的属性。希望这对于Polymer高手来说足够了:)
编辑2:
一些示例数据可以使最终目标更加明确。
假设位置是由以下字符串组成的数组:
Uncaught TypeError: Cannot read property 'some_location' of undefined
并说locations: {
type: Array,
value: ['location1', 'location2']
}
元素会为每个位置返回以下数据:
<get-data-at-location>
毕竟说完了,我希望<get-data-at-location
location=[[location]] //'location1'
data={{}}> //[{value: 4, time: 0}, {value: 5, time: 1}]
</get-data-at-location>
<get-data-at-location
location=[[location]] //'location2'
data={{}}> //[{value: 10, time: 1}, {value: 11, time: 2}]
</get-data-at-location>
能够获得以下信息:
alldata
所以,我希望在dom-repeat的所有实例中共享对象alldata: {
location1: [{value: 4, time: 0}, {value: 5, time: 1}],
location2: [{value: 10, time: 1}, {value: 11, time: 2}]
}
,这样他们就可以将数据全部放入各自的属性(这只是字符串值整个对象的位置)。
编辑3:
尝试了一些新事物。而不是alldata
作为返回指向_resolveRef(location)
应该存储数据的位置的指针的方式,我只使用了以下语法:<get-data-from-location>
并且事情更好,但仍然不完美。
{{alldata[location]}}
所以,这似乎有效!直到我意识到数据绑定的<template is="dom-repeat" items="[[locations]]" as="location">
<get-data-at-location
location="[[location]]"
data="{{alldata[location]}}">
</get-data-at-location>
<h5>Data at location: [[location]]</h5>
<template is="dom-repeat" items="{{alldata[location]}}" as="data">
<p>Data: {{data.value}}</p>
<p>Time: {{data.time}}</p>
</template>
</template>
...
alldata: {
type: Object
value: {}
}
不自定义元素的alldata
- 它似乎绑定到第一个alldata
的范围1}},第二个dom-repeat
可以访问。
所以基本上,如果我要在另一个页面中使用这个自定义元素并绑定到dom-repeat
,它就不起作用了:
alldata
<x-custom alldata={{allData}}></x-custom>
<x-pretty-json object={{allData}}></x-pretty-json>
只是打印提供的对象,在这种情况下,它只打印空括号<x-pretty-json>
。所以,更接近(有点),但仍然不是那么。