如何访问angularjs中的深度嵌套json对象

在这里，我想从第一页的Json数据中访问顶级市场详细信息，虽然我无法访问次级市场详细信息，但我能够访问。我想在下一页显示次级市场名称

$scope.myData = {
  "market": [{
    "mid": 3,
    "mname": "mark1",
    "submarket": [{
      "id": 20,
      "name": "val1"
    }, {
      "id": 24,
      "name": "val2",
      "submarket": [{
        "id": 26,
        "name": "val21"
      }]
    }]
    "market": [{
      "mid": 4,
      "name": "mark1.1",
      "submarket": [{....
      }]
    }]
  }, {
    "mid": 6,
    "mname": "mark2",
  }]
};

$scope.markname = []; /*stores top level markets*/
angular.forEach($scope.myData.market, function(org) {
  $scope.markname.push(org)
}) /*works fine and has the details of market (mid:3 and mid:6)*/

$scope.submark = [];
angular.forEach($scope.markname.submarket, function(sorg) {
  $scope.submark.push(sorg)
}) /*doesn't store anything*/

应该是：

  $scope.submark = [];
  angular.forEach($scope.markname, function(sorg) {
    angular.forEach(sorg.submarket, function(subsorg) {
      $scope.submark.push(subsorg)
    });
  });

应该是：

  $scope.submark = [];
  angular.forEach($scope.markname, function(sorg) {
    angular.forEach(sorg.submarket, function(subsorg) {
      $scope.submark.push(subsorg)
    });
  });

---

$scope.markname

是一个数组，您在第一次

forEach

时将项目推入其中，但在第二次尝试访问属性

子市场。这在
markname
数组中不存在，它存在于数组中的每个项上

我使用原生的
forEach
完成了我的示例，这里根本不需要angular参与，它还隐藏了未定义的问题，因为原生的数组原型是可用的，如果您尝试将其称为
未定义的
，angular会抛出异常，而angular愉快地接受
未定义的
，并继续

因此，一个简单的解决方法是

markname.forEach(function(sorg) {
    if (sorg.hasOwnProperty('submarket')) {
        submark.push(sorg.submarket);
    }
});

参见小提琴：


编辑：值得注意的是，这将生成一个多维数组，如果不需要，您可以使用如下内容将它们全部合并：

submark.push.apply(submark, sorg.submarket);

$scope.markname
是一个数组，您在第一次
forEach
中将项目推入其中，但在第二次尝试访问属性
子市场
。这在
markname
数组中不存在，它存在于数组中的每个项上

我使用原生的
forEach
完成了我的示例，这里根本不需要angular参与，它还隐藏了未定义的问题，因为原生的数组原型是可用的，如果您尝试将其称为
未定义的
，angular会抛出异常，而angular愉快地接受
未定义的
，并继续

因此，一个简单的解决方法是

markname.forEach(function(sorg) {
    if (sorg.hasOwnProperty('submarket')) {
        submark.push(sorg.submarket);
    }
});

参见小提琴：


编辑：值得注意的是，这将生成一个多维数组，如果不需要，您可以使用如下内容将它们全部合并：

submark.push.apply(submark, sorg.submarket);

您共享的json数据不正确。请检查一下

HTML:

<div ng-app="app" ng-controller="test">

</div>

var app = angular.module('app', []);

app.controller('test', function ($scope) {
    $scope.myData = {
        "market": [{
            "mid": 3,
            "mname": "mark1",
            "submarket": [{
                "id": 20,
                "name": "val1"
            }, {
                "id": 24,
                "name": "val2",
                "submarket": [{
                    "id": 26,
                    "name": "val21"
                }]
            }, {
                "mid": 4,
                "name": "mark1.1",
                "submarket": [{
                    "id": 27,
                    "name": "val221"
                }]
            }]
        }, {
            "mid": 6,
            "mname": "mark2",
        }]
    };

    $scope.markname = []; /*stores top level markets*/
    angular.forEach($scope.myData.market, function (org) {
        $scope.markname.push(org)
    }) /*works fine and has the details of market (mid:3 and mid:6)*/

    console.log('markname', $scope.markname);

    $scope.submark = [];
    angular.forEach($scope.markname, function (sorg) {
        angular.forEach(sorg.submarket, function (subM) {
            $scope.submark.push(subM)
        })
    })

    console.log('submark', $scope.submark);
});

您共享的json数据不正确。请检查一下

HTML:

<div ng-app="app" ng-controller="test">

</div>

var app = angular.module('app', []);

app.controller('test', function ($scope) {
    $scope.myData = {
        "market": [{
            "mid": 3,
            "mname": "mark1",
            "submarket": [{
                "id": 20,
                "name": "val1"
            }, {
                "id": 24,
                "name": "val2",
                "submarket": [{
                    "id": 26,
                    "name": "val21"
                }]
            }, {
                "mid": 4,
                "name": "mark1.1",
                "submarket": [{
                    "id": 27,
                    "name": "val221"
                }]
            }]
        }, {
            "mid": 6,
            "mname": "mark2",
        }]
    };

    $scope.markname = []; /*stores top level markets*/
    angular.forEach($scope.myData.market, function (org) {
        $scope.markname.push(org)
    }) /*works fine and has the details of market (mid:3 and mid:6)*/

    console.log('markname', $scope.markname);

    $scope.submark = [];
    angular.forEach($scope.markname, function (sorg) {
        angular.forEach(sorg.submarket, function (subM) {
            $scope.submark.push(subM)
        })
    })

    console.log('submark', $scope.submark);
});

markname
是一个数组，它没有要迭代的属性
submarket
，如果使用本机
forEach
而不是angulars
forEach
，这一点也会更加明显。Angulars版本处理未定义的传递，而如果调用未定义对象，则本机将不起作用，您将得到一个类型错误。基本清除！谢谢
markname
是一个数组，它没有要迭代的属性
submarket
，如果使用本机
forEach
而不是angulars
forEach
，这一点也会更加明显。Angulars版本处理未定义的传递，而如果调用未定义对象，则本机将不起作用，您将得到一个类型错误。基本清除！谢谢这1个有效。谢谢但问题是，这个数组将存储所有主要市场的次级市场的详细信息。我想做的是只显示我选择要查看的市场的子市场（在指数中，所有顶级市场名称都列为选项）。什么能帮助我实现这一点？在HTML代码中使用
ng repeat
和
ng show
获取完整的
myData。市场
阵列或控制器中的阵列，或使用视图中带有角度的
ng repeat
。这1起作用。谢谢但问题是，这个数组将存储所有主要市场的次级市场的详细信息。我想做的是只显示我选择要查看的市场的子市场（在指数中，所有顶级市场名称都列为选项）。什么能帮助我实现这一点？在HTML代码中使用
ng repeat
和
ng show
获取完整的
myData.market
阵列或控制器中的阵列，或使用视图中带有角度的
ng repeat
。