Templates 如果模板不起作用,则使用dom
Templates 如果模板不起作用,则使用dom,templates,polymer,conditional,web-component,polymer-2.x,Templates,Polymer,Conditional,Web Component,Polymer 2.x,dom,如果模板不起作用。我有以下聚合物2成分: <link rel="import" href="../bower_components/polymer/polymer-element.html"> <dom-module id="ohr-block"> <template> <style> :host { display: block; }
dom,如果模板不起作用。我有以下聚合物2成分:
<link rel="import" href="../bower_components/polymer/polymer-element.html">
<dom-module id="ohr-block">
<template>
<style>
:host {
display: block;
}
</style>
<h3>[[mydata.title]] [[_isType('one')]]</h3>
<template is="dom-if" if="[[_isType('one')]]"> <!-- problem is here -->
<div>Should be displayed</div>
</template>
</template>
<script>
/**
* @customElement
* @polymer
*/
class OhrBlock extends Polymer.Element {
static get is() { return 'ohr-block'; }
static get properties() {
return {
mydata: {
type: Object,
value: {"title": "my title", "type" : "one"}
}
};
}
_isType(type) {
return this.mydata.type === type;
}
}
window.customElements.define(OhrBlock.is, OhrBlock);
</script>
</dom-module>
:主持人{
显示:块;
}
[[mydata.title][[u isType('one')]]
应该显示
/**
*@customElement
*@聚合物
*/
OhrBlock类扩展聚合物元件{
静态get是(){return'ohr block';}
静态获取属性(){
返回{
我的数据:{
类型:对象,
值:{“标题”:“我的标题”,“类型”:“一”}
}
};
}
_isType(类型){
返回this.mydata.type===type;
}
}
window.customElements.define(OhrBlock.is,OhrBlock);
如您所见,我在h3
html标记中使用了[[u isType('one')]]
。在这里,它正在工作,我可以看到true
,但是当我在属性中使用[[[u isType('one')]]
类似条件时,如果属性不工作,模板内容也不显示。问题是我没有导入dom if
<link rel="import" href="../bower_components/polymer/lib/elements/dom-if.html">
问题是,如果
<link rel="import" href="../bower_components/polymer/lib/elements/dom-if.html">