使用AngularJS解析JSON

时间:2014-11-16 02:18:07

标签: javascript jquery json angularjs

我有以下JSON数据,我想使用AngularJS解析它

{
    "count": 104,
    "entries": [
        [
            "74",
            "Aakash",
            "/images/brands/aakash.png"
        ],
        [
            "51",
            "Aashirvaad",
            "/images/brands/aashirvaad.png"
        ],
        [
            "42",
            "ACT II",
            "/images/brands/act-ii.png"
        ],
        [
            "47",
            "Amul",
            "/images/brands/amul.png"
        ],
        [
            "48",
            "Anik",
            "/images/brands/anik.png"
        ],
        [
            "52",
            "Annapurna",
            "/images/brands/annapurna.png"
        ],
        [
            "3",
            "Ariel",
            "/images/brands/ariel.png"
        ],
        [
            "6",
            "Auyr Herbal",
            "/images/brands/ayur-herbal.png"
        ],
        [
            "29",
            "Axe",
            "/images/brands/axe.png"
        ],
        [
            "20",
            "Bajaj",
            "/images/brands/bajaj.png"
        ],
        [
            "46",
            "Boost",
            "/images/brands/boost.png"
        ],
        [
            "76",
            "Britannia",
            "/images/brands/britannia.png"
        ]
    ]
}

我将使用此函数获得JSON数据:

function customersController($scope,$http) 
{
    $http.get("http://example.com/website/brands_JSON.php")
        .success(function(response) {$scope.names = response;});
}

并尝试使用以下方式显示它:

<div ng-app="" ng-controller="customersController"> 
    <table class='table table-bordered'>
        <caption>BRAND'S LIST</caption>
        <thead>
            <tr><th>#</th><th>Brand Name</th><th>ImagePath</th><th>Image</th></tr>
        </thead>
        <tr ng-repeat="x in names.entries">
            <td>{{ names.entries[0][0]}} </td>
            <td>{{ names.entries[0][1]}} </td>
            <td>{{ names.entries[0][2]}} </td>
            <td>{{ names.entries[0][3]}} </td>
        </tr>

    </table>
</div>

但除了表头之外什么也没有显示。

有人可以帮忙吗?

1 个答案:

答案 0 :(得分:2)

你应该使用x [i]来显示数据,因为'ng-repeat =“x in names.entries”':

<div ng-app="" ng-controller="customersController">
<table class='table table-bordered'>
    <caption>BRAND'S LIST</caption>
    <thead>
        <!-- your table head -->
    </thead>
    <tr ng-repeat="x in names.entries">
        <td>{{x[0]}} </td> 
        <td>{{x[1]}} </td>
        <td>{{x[2]}} </td> 
    </tr>
 </table> 
</div>