从json文件angularjs读取

我有一个json文件，我想使用angularjs 1.6从中获取数据，我在controller中编写了一些代码。我想在控制台中整理对象的属性名称，如下所示：

['web-desktop','android','ios']

$http(request)
    .then(function onSuccess(jsonData) {
        angular.forEach(jsonData.data, function (item) {
            $scope.arrSeries.push(item.platform);
        });

response = {
    config: {method: "GET", transformRequest: Array(1), transformResponse: Array(1), paramSerializer: ƒ, jsonpCallbackParam: "callback", …},
    data: (3) [{…}, {…}, {…}],
    headers: ƒ (d),
    status: 200,
    statusText: "OK",
    xhrStatus: "complete"
}

问题是，它返回了一个未定义值的数组，并希望解决这个问题

有一个json文件“data.json”：

这是我的控制器：

'use strict';
var app= angular.module('app');
app.controller('MainController',['$scope', '$http', MainController]);

function MainController ($scope, $http) {

    // REQUEST OPTIONS USING GET METHOD.
    var request = {
        method: 'get',
        url: 'data.json',
        dataType: 'json',
        contentType: "application/json"
    };

    $scope.arrSeries = new Array;

    $http(request)
        .then(function onSuccess(jsonData) {
            angular.forEach(jsonData, function (item) {
                $scope.arrSeries.push(item.platform);
            });

            console.log($scope.arrSeries);


    }).catch(function onError(request) {
        console.log("not found");
    });
}

它在控制台中返回：

(6) [undefined, undefined, undefined, undefined, undefined, undefined]

---

诀窍在哪里

您需要直接遍历

jsonData.data

而不是

jsonData

中的项，如下所示：

['web-desktop','android','ios']

$http(request)
    .then(function onSuccess(jsonData) {
        angular.forEach(jsonData.data, function (item) {
            $scope.arrSeries.push(item.platform);
        });

response = {
    config: {method: "GET", transformRequest: Array(1), transformResponse: Array(1), paramSerializer: ƒ, jsonpCallbackParam: "callback", …},
    data: (3) [{…}, {…}, {…}],
    headers: ƒ (d),
    status: 200,
    statusText: "OK",
    xhrStatus: "complete"
}

这是因为

jsonData

是返回的响应对象，如下所示：

['web-desktop','android','ios']

$http(request)
    .then(function onSuccess(jsonData) {
        angular.forEach(jsonData.data, function (item) {
            $scope.arrSeries.push(item.platform);
        });

response = {
    config: {method: "GET", transformRequest: Array(1), transformResponse: Array(1), paramSerializer: ƒ, jsonpCallbackParam: "callback", …},
    data: (3) [{…}, {…}, {…}],
    headers: ƒ (d),
    status: 200,
    statusText: "OK",
    xhrStatus: "complete"
}

因此，如果您直接循环响应，您将循环6次尝试从每个项目（不存在）获取

platform

。这就是你得到的结果

请求返回的数据位于

response.data中

response = {
    ...
    data: (3) [{…}, {…}, {…}],
    ...
}

希望对您有所帮助。
在循环中控制项目，并检查您是否收到项目。forEach（jsonData，函数（item）{console.log（item）；$scope.arrSeries.push（item.platform）；}）；