顯示列表角

Question

我有此JSON（我沒有創建它，並且不能改變它）

{"tags": [ 
    { 
     "title": "news", 
     "options": [ 
      { 
      "title": "important", 
      }, 
      { 
      "title": "less important", 
      } 
     ] 
    }, 
    { 
     "title": "entertainment", 
     "options": [ 
      { 
       "title": "entertainment", 
      } 
      ] 
    } 

我想將其顯示爲一個列表，其中如果某個標題hasonly一個選項，則標題應顯示在列表中，如果標題在選項中有多個項目，則應顯示主標題並顯示選項標題。 最終結果（根據上面的例子）應顯示：

<ul> 
    <li>news<ul> 
       <li>important</li> 
       <li>less important</li> 
      </ul> 
     </li> 
    <li>entertainment</li> 
    </ul> 

我怎樣才能在angularJS這樣做呢？

Answer 1

如果myList是您在$scope中用於json對象的名稱，那麼您可以嘗試使用類似的方法。 基本上是ng-repeat與內ng-repeat

<ul ng-repeat="element in myList.tags"> 
    <li> 
     {{element.title}} 
     <ul ng-repeat="innerElement in element.options"> 
      <li>{{innerElement.title}}</li> 
     </ul> 
    </li> 
</ul> 

Answer 2

我假設你的JSON文件被存儲在一個變量稱爲結果

<ul ng-repeat = "tg in result.tags"> 
    <li ng-if="tg.options.length > 1">{{tg.title}} 
     <ul ng-repeat ="innerElement in tg.options" > 
     <li>{{innerElement.title}}</li> 
     </ul> 
    </li> 
    <li ng-if="tg.options.length==1">{{tg.title}}</li> 
</ul> 

Answer 3

日Thnx，無論上述建議有助於明確瞭解決辦法。 我需要將兩個ng-repeat循環嵌套在一起，並將ng-if應用於內部循環。

我結束了與此soultion：

<ul> <li ng-repeat="x in myData.tags"> {{x.title}} <ul ng-repeat="y in x.options" ng-if="x.options.length>1"> {{y.title}} </ul> </li> </ul>