json ng-repeat angularjs中的多級對象

Question

我們如何通過ng-repeat JSON下面顯示為ul>li列表？

像這樣：

• 家
• 關於我們
  • 大約一個
  • 大約兩個
• 服務
  • 服務一
  • 服務二

從JSON下面

{
    "Home_page": {
        "name": "Home",
        "shortname": "Home_page",
        "heading": "Welcome to BSL-I"
    },
    "About_us": {
        "About-One": {
            "name": "About one",  
            "heading": "Artist one"
        },
        "About-Two": {
            "name": "About Two",
            "heading": "About Two"
        }
    },
    "Service": {
        "Service-One": {
            "name": "About one",
            "shortname": "About_one",
            "heading": "Artist one"
        },
        "service-Two": {
            "About-One": {
                "name": "About one"
                        },
            "About-Two": {
                "name": "About Two"

            }
        }
    }
}

Answer 1

首先，您必須將JSON解碼為有效的javascript數組：

$scope.myArray = angular.fromJson(myJSONarray);

來自： https : //docs.angularjs.org/api/ng/function/angular.fromJson

上市第二名：

<ul>
  <li ng-repeat="element in myArray">
     {{element}}
     <ul ng-show="element[0]">
       <li ng-repeat="subElement in element[0]">
         {{subElement}}
       </li>
     </ul>
  </li>
</ul>

我沒有測試過，但看起來應該像上面一樣。

Answer 2

腳本：：

 $http.post('URL')
 .success(function (data, status, headers, config) {
     var res = JSON.parse(data);
      $scope.response= res;

現在，你的JSON對象是握住response 。

您可以使用響應來區分對象，例如：

response.Home_page, response.About_us.About-One, response.Service.Service-One, response.Service.service-Two

適用於HTML：

  <ul>
    <li ng-repeat="home in response.Home_page">
       {{home.name}}
   </li>
 </ul>