我有一个使用 <template is="dom-if"...
的 polymer 元素根据条件提供不同的 HTML 内容。
polymer dom-if
没有 else 条件,因此需要一个否定的 if 条件来模拟它。
类似这样的事情:
<link href="https://polygit.org/components/polymer/polymer.html" rel="import">
<dom-module id="test-thing">
<template>
<template is="dom-if" if="{{title}}" restamp>
<b>[[title]]</b>
</template>
<template is="dom-if" if="{{!title}}" restamp>
<i>no title</i>
</template>
</template>
<script>
Polymer({
is: 'test-thing',
properties: {
title: String
}
});
</script>
</dom-module>
<div>
With negative condition:
<test-thing></test-thing>
</div>
<div>
With positive condition:
<test-thing title="Has Title"></test-thing>
</div>
只有这样是行不通的 - 否定条件永远不会过去。
应该如何实现?
最佳答案
您的标题属性必须使用默认的空值:
title:{type: String,value:''}
像这样:
<link href="https://polygit.org/components/polymer/polymer.html" rel="import">
<dom-module id="test-thing">
<template>
<template is="dom-if" if="{{title}}" restamp>
<b>[[title]]</b>
</template>
<template is="dom-if" if="{{!title}}" restamp>
<i>no title</i>
</template>
</template>
<script>
Polymer({
is: 'test-thing',
properties: {
title: {type: String,value:''}
}
});
</script>
</dom-module>
<div>
With negative condition:
<test-thing></test-thing>
</div>
<div>
With positive condition:
<test-thing title="Has Title"></test-thing>
</div>
关于 polymer dom-if : how do I implement a negative condition?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41631186/