AngularJS 多维数组答案

【问题标题】：AngularJS multidimensional arraysAngularJS 多维数组
【发布时间】：2013-11-23 21:23:32
【问题描述】：

我正在寻找一种方法将范围内的三维数组中的数据与我的视图绑定..

我的范围（短版）是这样的

$scope.publicationData = [ 
    { pubId:'1' , pubName:'Level 1 A' , pubCat:[
        { pubCatId:'1' , pubCatName:'Level 2 A', pubSubCat:[ 
            { pubSubCatId:'1' , pubSubCatName:'Level 3 A' }, 
            { pubSubCatId:'2' , pubSubCatName:'Level 3 B' }
            ]
        },
        { pubCatId:'2' , pubCatName:'Level 2 B', pubSubCat:[
            { pubSubCatId:'3' , pubSubCatName:'Level 3 C' },
            { pubSubCatId:'4' , pubSubCatName:'Level 3 D' }
            ]
        }
        ]
    }];

在视图中，我的代码成功呈现了第一个和第二个数组维度中的内容，但我无法从 pubSubCatId 或 pubSubCatName 获取值

HTML + 角度视图

<div ng-controller="myPublictionCtrl">

<div ng-repeat="publication in publicationData">

    <ul>
        <li >
                            <!-- This works -->
            {{publication.pubId}}. {{publication.pubName}}
        </li>
    </ul>

    <ul>
                    <!-- This works -->

        <li ng-repeat="category in publication.pubCat">
            {{category.pubCatId}}. {{category.pubCatName}}
        </li>

    </ul>

    <ul>
                    <!-- This doesn't work -->

        <li ng-repeat="subcategory in publication.pubCat.pubSubCat">
            {{subcategory.pubSubCatName}}
        </li>
    </ul>
</div>
</div>

我将如何从范围的更深层次检索数据。 AngularJS 能做到这一点吗？

【问题讨论】：

这看起来不对publication.pubCat.pubSubCat...pubCat 是一个数组。
你想如何呈现它？如果你愿意，你可以使用嵌套的 ng-repeats。
我真的不想要一个嵌套的演示文稿......但这可能是我能做到的唯一方法......

标签： javascript arrays angularjs multidimensional-array

【解决方案1】：

第三个循环必须嵌套在第二个循环内，并使用

subcategory in category.pubSubCat

【讨论】：

哦，谢谢！我最初使用 category.pubSubCat，但无法让它显示数据，所以它让我失望，我开始做不合逻辑的事情。我最终遇到了嵌套问题。谢谢。

【解决方案2】：

<div ng-controller="myPublictionCtrl">
        <div ng-repeat="publication in publicationData">
            <ul>
                <li style="text-align:left">                       
                    {{publication.pubId}}. {{publication.pubName}}
                </li>
            </ul>
            <ul>
                <li ng-repeat="category in publication.pubCat" style="text-    align:left">{{category.pubCatId}}. {{category.pubCatName}}               
                <ul> 
                <li ng-repeat="subcategory in category.pubSubCat" style="text-align:left">{{category.pubCatId}}.{{subcategory.pubSubCatId}}.     {{subcategory.pubSubCatName}}
                </li>
                </li>
                </ul>
            </ul>
        </div>
    </div>

【讨论】：

如果你能在你的代码中添加一点解释就太好了。