AngularJS嵌套NG重複

我有這樣的HTML：AngularJS嵌套NG重複

<div class="fields-plan"data-ng-repeat="roomname in assign.roomname"> 
     <section> 
     <span>Room: {{roomname}}</span>   
     </section> 
    <ul data-ng-repeat="room in assign.rooms.roomname"> 
     <li> 
     {{room.room}} 
     </li> 
    <ul> 
</div>

和我的角度控制這個樣子的：

var room = {"1.2": 
       [ 
        {room: "1.2.1"}, 
        {room: "1.2.2"}, 
        {room: "1.2.3"} 
       ], 
     "1.3": [ 
      {room: "1.3.1"}, 
      {room: "1.3.2"}, 
      {room: "1.3.3"} 
     ]}; 


    var keys = Object.keys(room); 

    this.roomname = keys; 
    this.rooms = room;

在我第二次NG重複，它不工作，以及如何我可以根據房間名稱循環，從第一個ng的輸出重複？

來源

2015-02-12 max

你的第二個NG-重複需要採取的第一個NG-重複值，而不是直接以房間名，所以你的第二個NG重複應該是這樣的：

代碼：

<div class="fields-plan"data-ng-repeat="(key, value) in assign.rooms"> 
     <section> 
     <span>Room: {{key}}</span>   
     </section> 
    <ul data-ng-repeat="room in value"> 
     <li> 
     {{room.room}} 
     </li> 
    <ul> 
</div>

來源

2015-02-12 06:29:57 V31

我剛要回答這個問題，但他的JSON是不是右formatm他 – 2015-02-12 06:31:08

@ bto.rdz這不會工作：是啊JSON是關鍵，價值形式，以便更新代碼在答案 – V31 2015-02-12 06:36:31

謝謝。有用！ – max 2015-02-12 06:40:03

您可以通過稍微重新格式化Json然後使用以下代碼來實現此目的：

關鍵是使用第二個ng-repeat中第一個ng-repeat的值，而不是嘗試引用第一個集合。

HTML：

<div ng-controller="MyCtrl"> 

    <div class="fields-plan" ng-repeat="room in rooms"> 
      <section> 
      <span>Room: {{room.name}}</span>   
      </section> 
     <ul ng-repeat="subroom in room"> 
      <li> 
      {{room.subRoom}} 
      </li> 
     <ul> 
    </div> 
</div>

的javascript：

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

//myApp.directive('myDirective', function() {}); 
//myApp.factory('myService', function() {}); 

function MyCtrl($scope) { 
    $scope.rooms = [ { name : "1.2", 
         subRoom: [ 
        "1.2.1","1.2.2","1.2.3"], 
        }, { name: "1.3", 
     subRoom: [ 
      "1.3.1","1.3.2","1.3.3"]}]; 
}

小提琴演示：http://jsfiddle.net/0pnam0wj/

來源

2015-02-12 06:37:20 JanR

這是你想要的？

plnkr

<div data-ng-repeat="(roomnamePrefix, roomname) in rooms"> 
     <section> 
     <span>Room: {{roomnamePrefix}}</span>   
     </section> 
    <ul data-ng-repeat="room in roomname"> 
     <li> 
     {{room.room}} 
     </li> 
    <ul> 
</div>

來源

2015-02-12 06:39:02

AngularJS嵌套NG重複

回答

相關問題