Javascript 使用 AngularJS 将多维数组变成多级列表
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12696791/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Using AngularJS to turn a multi-dimensional array into a multi level list
提问by Chris Bier
I am using AngularJS and trying to use ng-repeat or the like to take a multi-dimensional array and put it into the DOM as a mutli-level list.
我正在使用 AngularJS 并尝试使用 ng-repeat 或类似方法来获取多维数组并将其作为多级列表放入 DOM 中。
From This:
由此：
var menuOptions = [
["Page One"],
["Page Two"],
["Page Three"],
["Page Four", ["Sub-Page 1", "Sub-Page 2", "Sub-Page 3"] ],
["Page Five"]
];
To This:
对此：
<ul>
<li>Page One</li>
<li>Page Two</li>
<li>Page Three</li>
<li>Page Four
<ul>
<li>Sub-Page 1</li>
<li>Sub-Page 2</li>
<li>Sub-Page 3</li>
</ul>
</li>
<li>Page Five</li>
</ul>
I was unable to find anything in the Angular JS Documentation and a search of the web came to no avail. I am aware that I can handle something like this with plain 'ol Javascript, or PHP but I would like to utilize some Angular JS thing like ng-repeat.
我在 Angular JS 文档中找不到任何内容，并且在网上搜索也无济于事。我知道我可以用普通的 'ol Javascript 或 PHP 处理这样的事情，但我想利用一些 Angular JS 的东西，比如 ng-repeat。
Any input is appreciated.
任何输入表示赞赏。
Thanks!
谢谢！
回答by bigblind
If you turn your array into the following
如果你把你的数组变成以下
var menuOptions = [
["Page One", []],
["Page Two", []],
["Page Three", []],
["Page Four", ["Sub-Page 1", "Sub-Page 2", "Sub-Page 3"] ],
["Page Five", []]
];
You should be able to do this:
你应该能够做到这一点：
<ul>
<li ng-repeat='option in menuOptions'>
{{option[?]}}
<ul>
<li ng-repeat='suboption in option[1]'>{{suboption}}</li>
</ul>
<li>
</ul>
回答by pherris
If you don't know the names of your keys, you can use this format...
如果您不知道密钥的名称，则可以使用这种格式...
JSON
JSON
{
"aclType": "combined",
"active": 1,
"attributes": {
"a6f8f9fb89ac4b2b12121c4ec4fa5441/#": [
"pub",
"sub",
"get",
"post",
"delete"
],
"a5f8f9eb89ac4b2b12121c4ec4fa8670/#": [
"pub",
"sub",
"get",
"post",
"delete"
]
}
}
You can loop like this:
你可以像这样循环：
<h2>Account Permissions</h2>
<ul>
<li>
<p><strong>Active:</strong> {{ acl.active}}</p>
</li>
<li ng-repeat="(key, data) in acl.attributes">
<p><strong>{{ key }}</strong></p>
<ul>
<li ng-repeat="permission in data">{{ permission }}</li>
</ul>
</li>
</ul>
