如何从AngularJS模板嵌套JSON数组值？ [英] How to get value from a nested JSON array in AngularJS template?

问题描述

我有以下一些JSON数据：

I have some JSON data below:

{
"tracks": [
    {
        "album": {
            "released": "2013",
            "href": "spotify:album:3qGeRY1wt4rrLIt1YuSwHR",
            "name": "The Marshall Mathers LP2 (Deluxe)",
            "availability": {
                "territories": "AD AR AT AU BE BG BO BR CH CL CO CR CY CZ DE DK DO EC EE ES FI FR GB GR GT HK HN HR HU IE IS IT LI LT LU LV MC MT MY NI NL NO NZ PA PE PH PL PT PY RO SE SG SI SK SV TR TW UY"
            }
        },
        "name": "The Monster",
        "popularity": "0.94",
        "external-ids": [
            {
                "type": "isrc",
                "id": "USUM71314082" <-- I want this value
            }
        ],
        "length": 250.188,
        "href": "spotify:track:5U8hKxSaDXB8cVeLFQjvwx",
        "artists": [
            {
                "href": "spotify:artist:7dGJo4pcD2V6oG8kP0tJRR",
                "name": "Eminem"
            },
            {
                "href": "spotify:artist:5pKCCKE2ajJHZ9KAiaK11H",
                "name": "Rihanna"
            }
        ],
        "track-number": "12"
    },
    ...
]}

我能够拿出像专辑名称，发行日期等，而不是外部的IDS ID其他值。这些都是两种方式我在角模板曾尝试：

I am able to take out other values like album name, release date etc, but not the external-ids id. these are the two ways i have tried in my angular template:

<div class="panel panel-success" ng-repeat="track in something.tracks">
    <p>Track name: {{ track.name }}</p>
    <p>Album release date: {{ track.album.released }}</p>
    <p>Spotify id: {{track.external-ids[0].id}} </p>

    <!-- <span ng-repeat="obj in track.external-ids">  
            <p>Spotify id: {{ obj.id }}</p>
        </span> -->

</div>

这是两个解决方案，我想出了但既不似乎工作。第一个（不注释掉）返回0，第二个不显示Spotify的ID：行所有

those are the two solutions i came up with but neither seem to work. The first one (not commented out) returns 0, the second one doesn't display the "spotify id:" line at all.

有人是否知道如何做到这一点？它似乎pretty简单，但我只是不能似乎让我的头周围。谢谢。

Does anybody know how to do this? it seems pretty straightforward but i just cant seem to get my head around it. Thanks.

推荐答案

要访问包含您需要使用括号标记破折号属性：

To access a property that contains a dash you need to use the bracket notation:

<p>Spotify id: {{track['external-ids'][0].id}} </p>

否则解析器会间preT是减法运算符：

Otherwise the parser will interpret is as the subtraction operator:

track.external - ids[0].id

演示： http://plnkr.co/编辑/ gIyXg8y0Pn1TuK0uI6qD？p = preVIEW

这篇关于如何从AngularJS模板嵌套JSON数组值？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！