如何在 dom-if
条件下访问元素?
这是我模板的一部分:
<template>
...
<template is="dom-if" if="{{_displayUserLevelBadge(level)}}">
<div class="profileUserLevelContainer">
<iron-icon id="userLevelBadge" class="icon-20" icon="chat:verified-user"></iron-icon>
<span class="profileUserLevel">{{userLevelString}}</span>
</div>
</template>
...
</template>
我需要像这样在 Javascript 中访问 #userLevelBadge
:
查看 ready
方法。
Polymer({
is: 'custom-element',
properties: {
level: {
type: String,
value: null
},
userLevelString: {
type: String,
value: ''
}
},
ready: function() {
var userLevelBadge = this.$$('#userLevelBadge'); //return undefined
},
_displayUserLevelBadge: function(){
//not including my code
//Just returning true for simplicity
return true;
}
}
但它不起作用。满足条件,显示dom-if
中的HTML,但我无法使用this.$$(selector)
访问它,如Wiki中指定.
最佳答案
将代码包装在 this.async()
中,让 Polymer 有时间标记模板内容。
关于javascript - 访问 Polymer 动态元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34373317/