[英]polymer binding a function result inside template
I'm trying to avoid calling multiple times the same function in a dom-repeat
. 我试图避免在dom-repeat
多次调用同一函数。
Example: 例:
<template is="dom-repeat" items="..." as="column">
<template result="_myFunction(column, index)">
<div>Primary: [[result.primary]]</div>
<div>Secondary: [[result.secondary]]</div>
...
</template>
</template>
...
_myFunction(column, index) {
return { primary: "1", secondary: "2", ......}
}
But I can't find the correct way of doing this, for the moment I'm calling _myFunction(column, index)
in all my <div>
s. 但是我找不到正确的方法,目前我在所有<div>
中都调用_myFunction(column, index)
。
How to avoid calling the function multiple times ? 如何避免多次调用该函数?
Try with the following code, Its working example of polymer custom element with DOM repeat, hope this will work for you, 尝试以下代码,重复使用DOM的聚合物自定义元素的工作示例,希望这对您有用,
<dom-module id="your-template-container">
<template>
<template is="dom-repeat" items="{{data}}" as="column">
<div>Primary: [[column.primary]]</div>
<div>Secondary: [[column.secondary]]</div>
</template>
</template>
<script>
Polymer({
is: 'your-template-container',
ready: function() {
// Sample object data is below
this.data = [
{primary: 1, secondary: 2},
{primary: 1, secondary: 2},
{primary: 1, secondary: 2}
];
}
});
</script>
</dom-module>
<!-- THE FOLLOWING WILL RENDER YOU POLYMER CUSTOM ELEMENT WITH DOM REPEAT-->
<your-template-container></your-template-container>
I found a way to avoid calling _myFunction
multiple times using cache: 我找到了一种避免使用缓存多次调用_myFunction
方法:
Before the `dom-repeat`:
execute the function
cache the result in an object
In the `dom-repeat`
use the cached-object to retrieve the value
Bonus: using memoization might also work 奖励:使用记忆也可能有效
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.