javascript - IDに基づくAngular JSのネストされた子

Question

「ツリー」ナビゲーションを作成していますが、子アイテムのネストに問題があり、サーバーから次のような JSON データが送信されます。

JSON :

0: {id:5, parentid:0, text:PlaceHolder}
1: {id:6, parentid:0, text:PlaceHolder}
2: {id:7, parentid:0, text:PlaceHolder}
3: {id:8, parentid:7, text:PlaceHolder}
4: {id:9, parentid:7, text:PlaceHolder}
5: {id:10, parentid:5, text:PlaceHolder}
6: {id:11, parentid:5, text:PlaceHolder}
7: {id:12, parentid:7, text:PlaceHolder}
8: {id:15, parentid:0, text:PlaceHolder}
9: {id:16, parentid:15, text:PlaceHolder}
10: {id:17, parentid:5, text:PlaceHolder}
11: {id:18, parentid:15, text:PlaceHolder}
12: {id:19, parentid:15, text:PlaceHolder}
13: {id:20, parentid:0, text:PlaceHolder}
14: {id:21, parentid:15, text:PlaceHolder}
15: {id:23, parentid:5, text:PlaceHolder}

「parentid」に注意してください。「0」は、アイテムが最上位の親であることを意味します。たとえば、'parentid' が 7 の場合、'id' 7 の子になります。

HTML:

<li ng-repeat="link in links"><a href="#/page/{[{link.id}]}">{[{link.text}]}</li>

JS:

var Site = angular.module('Site', []);

Site.config(function ($routeProvider) {
  $routeProvider
    .when('/page/:slug', {templateUrl: 'partials/page.html', controller: 'RouteController'})
    .otherwise({redirectTo: '/page/home'});
});

function AppController ($scope, $rootScope, $http) {
  /* Load pages on startup
  $http.get('pages.json').success(function (data) {
    $rootScope.pages = data;
  }); */
  // Load navigation on startup
  $http.get('/university/list').success(function (data) {
    $rootScope.links = data;

  });
  // Set the slug for menu active class
  $scope.$on('routeLoaded', function (event, args) {
    $scope.slug = args.slug;
  });
}

function RouteController ($scope, $rootScope, $routeParams) {
  // Getting the slug from $routeParams
  var slug = $routeParams.slug;

  $scope.$emit('routeLoaded', {slug: slug});
  $scope.page = $rootScope.pages[slug];
}