Question

如何加载json文件并在重复模板中使用数据？这段代码不会产生任何结果：

<dom-module id="name-list">
    <template>
        <iron-ajax auto url="names.json" handleAs="json" lastResponse="{{data}}"></iron-ajax>
        <template is="dom-repeat" items="{{data}}">
            <div>First name: <span>{{item.firstName}}</span></div>
            <div>Last name: <span>{{item.lastName}}</span></div>
        </template>
    </template>
</dom-module>

<script>
    Polymer({
        is: "name-list"
    });
</script>

这是我的json文件（编辑：经过反复修改后的更正）：

{
    [
        {
            "firstName": "John",
            "lastName": "Smith"
        },{
            "firstName": "Jane",
            "lastName": "Doe"
        }
    ]
}

我想拥有以下内容：

<div>First name: <span>John</span></div>
<div>Last name: <span>Smith</span></div>
<div>First name: <span>Jane</span></div>
<div>Last name: <span>Doe</span></div>

我在我的代码中的其他地方包含了铁-jax。我已经测试了一般功能。它起作用，而不是在数据绑定的上下文中。

Answer 1

首先，正如vasek所说，你的JSON是不正确的。 dom-repeat需要一个数组来迭代，你的JSON当前正在返回一个对象。其次，您正在错误地访问iron-ajax元素上的属性。作为docs州

为了使用属性配置元素的camel-case属性，应在属性名称中使用dash-case。

您正在尝试设置handleAs和lastResponse。为了做到这些，您需要将它们更改为破折号：

<iron-ajax auto url="names.json" handle-as="json" last-response="{{data}}"></iron-ajax>

否则，其他一切都应该正常工作。

Answer 2

您的json文件格式错误。它应该是这样的：

self.genericThread

Answer 3

我也遇到了类似的代码，不幸的是上面的答案并没有为我解决问题。但是，当我将<iron-ajax>元素放在<template is="dom-repeat">之后时，它对我有效。

在重复模板中使用聚合物铁-ajax

3 个答案: