通过angularjs绑定hierchical json

我想通过angular.js将json的两个级别绑定到div。第一层如期待，但第二层不是。您能否请建议我应该如何更改下面的示例http://plnkr.co/edit/iV72hp6nQMUQh1K082Ej中的绑定，看起来绑定无法嵌套。通过angularjs绑定hierchical json

来源

2013-04-24 Abhishek Subradeep

我修改代码如下，它正在现在

<!DOCTYPE html> 
<html ng-app> 
<head> 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script> 
    <script src="app.js"></script> 

    <style> 
    .mHeader 
    { 
    background-color:Black; 
    color: Orange; 
    width: 200px; 
    padding-bottom: 0px; 
    margin-bottom: 0px; 
    } 
    </style> 
</head> 
<body> 

<div ng-controller="MeetingsCtrl"> 
    <div id="div1" style="background-color: Brown; width: 200px;"> 

    </div> 

    <script> 
     function MeetingsCtrl($scope, $compile) { 
      $scope.itemselected = "None"; 
      $scope.meetings = [ 
       { 
        country: 'South Africa', 
        children: [ 
         {name: "H1"}, 
         { name: "H2" } 
        ] 
       }, 
       { 
        country: 'Great Britain', 
        children: [{ name: "H3" }, 
         { name: "H4" }] 
       }, 
       { 
        country: 'United States', 
        children: [{ name: "H5" }, 
         { name: "H6" }] 
       }, 
       { 
        country: 'Zimbabwe', 
        children: [{ name: "H7" }, 
         { name: "H8" }] 
       } 
      ]; 

      $('#div1').html(
     $compile(
     '<ul><li ng-repeat="meeting in meetings"><a>{{meeting.country}}</a> <ul><li ng-repeat="child in meeting.children">{{child.name}}</li></ul></li></ul>' 
     )($scope) 
    ); 
      $('#div1').prepend('<div class="mHeader">Race cources</div>'); 

     } 

    </script> 
</body> 
</html>

来源

2013-04-24 13:40:14

通过angularjs绑定hierchical json

回答

相关问题