循环遍历Handlebars中的json数据

时间:2014-05-04 12:16:27

标签: javascript json handlebars.js

在把手网站上,我可以看到如何遍历数组,但我正在尝试查看数组对象而没有运气。

这是我的数据,我使用jquery和jsonp命令返回。

[
    {
        "id": 95,
        "user_id": 6,
        "status": 1,
        "name": "Lost & Co",
        "country": {
            "code": "GB",
            "name": "United Kingdom"
        },
        "city": "London",
        "venue": "Lost & Co",
        "fsqid": "512fb191e4b0f660fda426eb",
        "address": "160 Putney High Street",
        "postcode": null,
        "lat": "51.461322924772",
        "lng": "-0.21689196269354",
        "phone": "+442087802235",
        "description": null,
        "date": "2014-05-10",
        "time": "",
        "image": null,
        "image_thumb": null,
        "website": "",
        "twitter": null,
        "tickets": "",
        "fb_event": null,
        "created_at": "2014-04-24 12:20:09",
        "updated_at": "2014-04-24 12:20:09"
    },
    {
        "id": 96,
        "user_id": 6,
        "status": 1,
        "name": "Lost & Co",
        "country": {
            "code": "GB",
            "name": "United Kingdom"
        },
        "city": "London",
        "venue": "Lost & Co",
        "fsqid": "512fb191e4b0f660fda426eb",
        "address": "160 Putney High Street",
        "postcode": null,
        "lat": "51.461322924772",
        "lng": "-0.21689196269354",
        "phone": "+442087802235",
        "description": null,
        "date": "2014-05-24",
        "time": "",
        "image": null,
        "image_thumb": null,
        "website": "",
        "twitter": null,
        "tickets": "",
        "fb_event": null,
        "created_at": "2014-04-24 12:20:57",
        "updated_at": "2014-04-24 12:20:57"
    },
    {
        "id": 94,
        "user_id": 6,
        "status": 1,
        "name": "Lost Society",
        "country": {
            "code": "GB",
            "name": "United Kingdom"
        },
        "city": "London",
        "venue": "Lost Society",
        "fsqid": "4bbcf543593fef3b35de0256",
        "address": "697 Wandsworth Rd",
        "postcode": "SW8 3JF",
        "lat": "51.467991033249",
        "lng": "-0.14425992965698",
        "phone": "+442076526526",
        "description": null,
        "date": "2014-05-31",
        "time": "",
        "image": null,
        "image_thumb": null,
        "website": "http://www.lostsociety.co.uk/index2.html",
        "twitter": "lostsocietybar",
        "tickets": "",
        "fb_event": null,
        "created_at": "2014-04-24 12:18:53",
        "updated_at": "2014-04-24 12:18:53"
    },
    {
        "id": 97,
        "user_id": 6,
        "status": 1,
        "name": "Campus North",
        "country": {
            "code": "GB",
            "name": "United Kingdom"
        },
        "city": "Newcastle",
        "venue": "Campus North",
        "fsqid": "533b05b0498ea89103652747",
        "address": "5 Carliol Square",
        "postcode": null,
        "lat": "54.973037719727",
        "lng": "-1.6087431907654",
        "phone": null,
        "description": null,
        "date": "2014-06-12",
        "time": "",
        "image": null,
        "image_thumb": null,
        "website": "",
        "twitter": null,
        "tickets": "",
        "fb_event": null,
        "created_at": "2014-04-24 17:56:26",
        "updated_at": "2014-04-24 17:55:55"
    },
    {
        "id": 91,
        "user_id": 6,
        "status": 1,
        "name": "Glastonbury",
        "country": {
            "code": "GB",
            "name": "United Kingdom"
        },
        "city": "Pilton",
        "venue": "Glastonbury",
        "fsqid": null,
        "address": null,
        "postcode": null,
        "lat": null,
        "lng": null,
        "phone": null,
        "description": null,
        "date": "2014-06-28",
        "time": "",
        "image": null,
        "image_thumb": null,
        "website": "http://www.glastonburyfestivals.co.uk/",
        "twitter": null,
        "tickets": "",
        "fb_event": null,
        "created_at": "2014-04-22 12:08:32",
        "updated_at": "2014-04-22 13:06:51"
    },
    {
        "id": 92,
        "user_id": 6,
        "status": 1,
        "name": "Glastonbury",
        "country": {
            "code": "GB",
            "name": "United Kingdom"
        },
        "city": "Pilton",
        "venue": "Glastonbury",
        "fsqid": null,
        "address": null,
        "postcode": null,
        "lat": null,
        "lng": null,
        "phone": null,
        "description": null,
        "date": "2014-06-29",
        "time": "",
        "image": null,
        "image_thumb": null,
        "website": "http://www.glastonburyfestivals.co.uk/",
        "twitter": null,
        "tickets": "",
        "fb_event": null,
        "created_at": "2014-04-22 12:08:46",
        "updated_at": "2014-04-22 13:07:27"
    },
    {
        "id": 80,
        "user_id": 6,
        "status": 1,
        "name": "TBA",
        "country": {
            "code": "ES",
            "name": "Spain"
        },
        "city": "Ibiza",
        "venue": "TBA",
        "fsqid": "51fab9b1498e0ced82ae61d0",
        "address": "Mediterranean Sea",
        "postcode": null,
        "lat": "38.970107",
        "lng": "1.305714",
        "phone": null,
        "description": null,
        "date": "2014-09-12",
        "time": "",
        "image": null,
        "image_thumb": null,
        "website": "",
        "twitter": null,
        "tickets": "",
        "fb_event": null,
        "created_at": "2014-02-27 00:41:49",
        "updated_at": "2014-02-27 00:41:49"
    }
]

我正在尝试这个,但它不起作用。我错过了一些明显的东西吗?

    <ul>
        {{#each}}
        <li>
            <h3>{{ venue }}</h3>
        </li>
        {{/each}}
    </ul>

1 个答案:

答案 0 :(得分:2)

您需要为#each提供一个上下文:

{{#each .}}
    <li>
        <h3>{{ venue }}</h3>
    </li>
{{/each}}

你所缺少的是你需要让把手知道它是你想要迭代的根对象。