2015-01-21 7 views
5

Mam tablicę z listą obiektów. Każdy obiekt zawiera również tablicę (patrz poniżej). Używam ng-repeat do iteracji poprzez tablicę potomną dla każdego obiektu, próbowałem na wiele różnych sposobów, ale to po prostu nie działa w ogóle. Każda wskazówka, kierunek, pomoc będą bardzo cenne. Dziękuję Ci. :-)ng-repeat, aby uzyskać dostęp do tablicy wewnątrz obiektów

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js"></script> 
<script> 
    angular.module('mlApp', []) 
     .controller('mlCtrl', [function() { 
      var self = this; 
      self.contacts = [ 
      { contact: 'AAA', mlist: [1, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 1] }, 
      { contact: 'BBB', mlist: [0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 1,1, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1] } 

      ]; 
} ]); 

<div ng-app="mlApp" ng-controller="mlCtrl as mCtrl"> 
<table> 
<thead>..</thead> 
<tbody> 
    <tr ng-repeat="p in mCtrl.contacts"> 
     <th width="100px" >{{p.contact}}</th> 
     <td ng-repeat="c1 in p.mlist"><input type="checkbox" ng-check='{{c1}}' /></td> 
    </tr> 

</tbody> 
</table> 
</div> 

Odpowiedz

11

Podpowiedź jest sprawdzenie konsolę do errors - kątowa jest (zazwyczaj) bardzo pomocny w takich rzeczach.

Masz duplikaty wartości w swojej macierzy, których używasz w wewnętrznym powtórzeniu, więc musisz je śledzić przez coś. Użyłem $ index w tym przykładzie:

angular.module('mlApp', []) 
 
    .controller('mlCtrl', [ 
 
    function() { 
 
     var self = this; 
 
     self.contacts = [{ 
 
      contact: 'AAA', 
 
      mlist: [1, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 1] 
 
     }, { 
 
      contact: 'BBB', 
 
      mlist: [0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 1, 1, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1] 
 
     } 
 

 
     ]; 
 
    } 
 
    ]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="mlApp" ng-controller="mlCtrl as mCtrl"> 
 
    <table> 
 
    <thead>..</thead> 
 
    <tbody> 
 
     <tr ng-repeat="p in mCtrl.contacts"> 
 
     <th width="100px">{{p.contact}}</th> 
 
     <td ng-repeat="c1 in p.mlist track by $index"> 
 
      <input type="checkbox" ng-check='{{c1}}' /> 
 
     </td> 
 
     </tr> 
 

 
    </tbody> 
 
    </table> 
 
</div>

+0

Jesteś człowiekiem !!! Dziękuję Ci bardzo. To działa! –

+0

To musi działać! Nie ma za co. :) I zapraszamy do Stack Overflow! – Shomz

+1

NOWA odpowiedź. @GeorgeHuang, ale jeśli zastanawiasz się, dlaczego to nie zaznacza pola wyboru i nie aktualizuje wartości podczas zaznaczania lub odznaczania? musielibyśmy je nieco poprawić za pomocą ' 'Musisz użyć' ng-model' 'ng-true/false-value', aby ng-model był odpowiednio ustawiony, a ng-checked to tylko naprawienie błędu gdzie truevalue/falsevalue nie wie, czy jest to liczba całkowita ciągu. – PSL

0

samo jak, że można to zrobić:

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

 
myApp.controller('mycontroller',['$scope',function($scope){ 
 
    
 
    $scope.students=[]; 
 
    var i=0; 
 
    for(i=0;i<5;i++){ 
 
    var item={Name:'',Marks:[]}; 
 
    
 
    item.Name='student' + i; 
 
    item.Marks.push({Maths:50-i,Science:50 +i}); 
 
    
 
    $scope.students.push(item); 
 
    } 
 

 
}]);
<html ng-app='myApp'> 
 
    <head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script> 
 
</head> 
 
    <body ng-controller='mycontroller'> 
 
    <div ng-repeat='student in students'> 
 
     Name : {{student.Name}} 
 
     <span ng-repeat="m in student.Marks">Maths:{{m.Maths}} Science:{{m.Science}}</span> 
 
     </div> 
 
    </body> 
 
</html>