首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >聚合物重复字典不适用于索引

聚合物重复字典不适用于索引
EN

Stack Overflow用户
提问于 2015-01-14 00:57:09
回答 1查看 465关注 0票数 0

我已经创建了自己的聚合物js元素,并试图对字典中的索引值执行repeat迭代。不幸的是我不能让它重复一遍。

下面是迭代-example.html:

代码语言:javascript
复制
<link href="../polymer/polymer.html" rel="import">
<polymer-element name="iterative-example">
    <template>

        <!-- Doesn't work -->
        <template repeat="{{ lower, upper in letters }}">
            <p>{{ lower }} and {{ upper }}</p>
        </template>

         <!-- Works -->
        <template repeat="{{ letters in lettersArray }}">
            <p>{{ letters }}</p>
        </template>

    </template>
<script>
    Polymer('iterative-example', {
        letters: {'a':'A', 'b':'B', 'c':'C'},
        lettersArray: ['a', 'b', 'c']
   });
</script>
</polymer-element>

然后在index.html中:

代码语言:javascript
复制
<html>
<head>
    <script src="../webcomponentsjs/webcomponents.min.js"></script>
    <link rel="import" href="components/iterative-example.html">
</head>
<body>
    <iterative-example></iterative-example>
</body>
</html>

这就是我在浏览器中呈现的结果:

代码语言:javascript
复制
<iterative-example>
    <template repeat="{{ lower, upper in letters }}">
        #document-fragment
    </template>
    <template repeat="{{ letters in lettersArray }}">
        #document-fragment
    </template>
    <p>a</p>
    <p>b</p>
    <p>c</p>
</iterative-example>

为什么对字典的迭代不能工作?

我有一个特殊的空白外部模板的阴影。控制台没有抛出任何错误。根据这里的说法,我应该能够用字典来做这件事。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-01-14 05:20:19

我认为您只能遍历数组对象,而不能遍历对象文本。但是,使用下面的筛选技巧,您可以将对象转换为数组。

代码语言:javascript
复制
    <polymer-element name="iterative-example">
<template>

    <!-- Doesn't work -->
    <template repeat="{{ letter in letters | toArray }}">
        <p>{{ letter.lower }} {{ letter.upper }}</p>
    </template>

     <!-- Works -->
    <template repeat="{{ letters in lettersArray }}">
        <p>{{ letters }}</p>
    </template>

</template>
<script>
    Polymer('iterative-example', {
        letters: {'a':'A', 'b':'B', 'c':'C'},
        lettersArray: ['a', 'b', 'c'],
        toArray:function  (argument) {
            var result = [];
            for (var property in argument) {
                if (argument.hasOwnProperty(property)) {
                    result.push({lower:property, upper:argument[property]});
                }
            }
            return result;
        }
   });
</script>
</polymer-element>
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/27934197

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档