添加treeview的ASP.NET MVC與AngularJS

Question

我有一個名單，2級，在我vbhtml正在顯示的頁面是這樣的：

<li>Contract Coverage:</li> 
<li ng-repeat="(key, val) in orgSettings"> 
    <label>{{key}}</label>   
    <ul> 
     <li ng-repeat="setting in val">{{setting.settingname}}</li> 
    </ul> 
</li> 
<li> 

3行代表一個組織，並多次設置將被下面所列（第5行中的ng重複）。 我想將此顯示轉換爲組織級別的可摺疊/展開式樹形視圖，以便設置可以隱藏起來，並且可以展開以顯示列表中特定組織的下方，如果用戶單擊旁邊的加號它。

請幫忙嗎？

Answer 1

最簡單的方法我能想到的是：

<li ng-init="visible = {}">Contract Coverage:</li> 
<li ng-repeat="(key, val) in orgSettings" ng-init="visible[key]=true" ng-click="visible[key]=!visible[key]" > 
    <label>{{key}}</label>   
    <ul ng-show="visible[key]"> 
     <li ng-repeat="setting in val" >{{setting.settingname}}</li> 
    </ul> 
</li> 
<li> 

看到這個plunker：http://plnkr.co/edit/vge0wqV590cCsofUZU05?p=preview