2

我有一个简单的 dom 模块，里面有一个 dom-repeat 模板：

<dom-module id="bookmark-extends">
<style>(...)</style>
<template>
        <template is="dom-repeat" items="[[extends]]" as="extend">
                <a href="[[extend.url]]">
                <paper-button>[[extend.__firebaseKey__]]</paper-button>
                </a>
        </template>
</template>
</dom-module>
<script>
Polymer({
is: 'bookmark-extends',
properties: {
    extends: {
        type: Array,
        notify: true,
        value: function(){ return []; }
    }
}
});
</script>

我在这里使用它：

<dom-module id="bookmark-cards">
<style>(...)</style>
<template>
    <firebase-collection
        location="*******"
        data="{{bookmarks}}"></firebase-collection>
    <template is="dom-repeat" items="[[bookmarks]]" as="bookmark">
        (...)
            <div hidden="[[!bookmark.extendable]]" class="card-actions">
                <bookmark-extends extends="[[bookmark.extends]]">
                </bookmark-extends>
            </div>     
            <div hidden="[[!bookmark.searchable]]" class="card-actions">
                <input-search-on-site id="input" website-name="[[bookmark.__firebaseKey__]]" website-search-url="[[bookmark.searchUrl]]">
                </input-search-on-site>
            </div>          
        </paper-card>
    </template>
 </template>
</dom-module>
<script>Polymer({
is: 'bookmark-cards'
});</script>

我收到此错误：

未捕获的类型错误：无法读取未定义的属性“扩展”

请帮助我，我不知道该怎么做，因为在我的第二个代码中，几乎相同的过程正在运行......

编辑：

现在我不再使用额外的模块，也不再使用“扩展”这个词了......

            <div hidden="[[!bookmark.expandable]" class="card-actions">
                <template is="dom-repeat" items="[[bookmark.links]]" as="link">
                    <a href="{{link.url}}"><paper-button>{{link.__firebaseKey__}}</paper-button></a>
                </template>
            </div>

新的错误是：“[dom-repeat::dom-repeat]：项目的预期数组，找到对象”如果我试试这个：

properties: {
    links: {
        type: Array,
        notify: true,
        value: function(){ return []; }
    }
}

同样的错误来了。

4

1 回答 1

0

几件事。根据 Polymer 的建议，将您的脚本元素移动到 dom-module 标记内。

https://www.polymer-project.org/1.0/docs/devguide/properties.html

其次，不要使用“扩展”作为实例变量/属性名称。Extends 是用于扩展现有 HTML 元素的 Polymer 关键字。

https://www.polymer-project.org/1.0/docs/devguide/registering-elements.html

这个 Plunker 显示了关键变化：http ://plnkr.co/edit/BKzrfC

<dom-module id="bookmark-extends">
<template>
        <template is="dom-repeat" items="[[extnds]]" as="extend">
                <div>extend</div>
        </template>
</template>
<script>
Polymer({
is: 'bookmark-extends',
properties: {
    extnds: {
        type: Array,
        notify: true,
        value: function(){ return ['one', 'two']; }
    }
}
});
</script>
</dom-module>
于 2015-10-26T11:48:19.547 回答