dom-如果模板不起作用

Question

dom-if 模板不起作用。我有以下 聚合物 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>

如您所见，我在 h3 html 标签内使用了 [[_isType('one')]]。在这个地方它正在工作，我可以看到 true 但是当我在 if 属性中使用 [[_isType('one')]] 之类的条件时，它不起作用并且没有显示模板内容。

Answer 1

问题是我没有导入dom-if

<link rel="import" href="../bower_components/polymer/lib/elements/dom-if.html">

dom-如果模板不起作用

dom-if template does not work

conditional

templates

web-component

polymer

polymer-2.x