使用 AngularJS 访问视图中的控制器值

Question

我正在尝试使用AngularJS在视图中显示JSON嵌套数组中的值。

我已经在控制台.log（）上检查了输出，并且按预期返回了JSON对象。但我想在我的视图中显示细节。特别是，我想将它们显示为所有高级值及其关联的子级别值。

这是我的应用程序.js它获取 JSON 并迭代它以获取所有高级值及其关联的子级项。

angular.forEach($scope.data, function(value, key)
{
    // Gets the high level items - WORKING
    console.log("Check Item Description: " + value.checkitemdesc);
    angular.forEach(value.options, function(v, k)
    {
        // Gets the sub-level items - WORKING
        console.log("Check ID: " + v.fleetcheckid);
        console.log("Check Value Description: " + v.checkvaluedesc);
    });
});

然后我想在列表项组件的温泉 UI 开关中显示高级项目

<ul class="list">
    <li class="list__item" ng-repeat="val in value">  
    {{val.checkitemdesc}} <!-- NOT WORING HERE -->
        <label class="switch switch--list-item">
            <input type="checkbox" 
                class="switch__input" 
                checked 
                onclick="modal.show('modal')">
            <div class="switch__toggle"></div>
        </label>
    </li>
</ul>

如何访问 forEach 循环返回的值数组？我尝试在我的外部 forEach 循环中创建一个数组，然后将每个值推送到它，但收到错误消息说值未定义

$scope.itemDescriptionArray.push(value.checkitemdesc);

Answer 1

假设您有以下层次结构：

$scope.items = {
 id1: {
  foo: 'bar'
 }
 id2: {
  foo: 'foo'
 }
}

你想在模板中迭代它，你最终会做这样的事情：

<ul ng-repeat="(id,item) in items">
   Item {{id}}
   <li ng-repeat="(key,value) in item">
    {{key + '=>' + value}}
   </li>
</ul>

如果要迭代非关联数组，则无需在模板上定义元组。