ng-repeat对象数组（使用ng-start）

我有一个我试图显示的对象数组。问题是我只能通过它的属性名称来访问数据。我想要迭代使用对象的关键。ng-repeat对象数组（使用ng-start）

该对象有两个属性，每个属性表示一个开始时间和一个结束时间。他们将被显示在每个单元格中。

我的表的结构是这样的：

<table class="table table-striped"> 
    <tr> 
     <th></th> 
     <th ng-repeat="department in departments" style="vertical-align:top" colspan="2">{{department}}</th> 
    </tr> 
    <tr ng-repeat="time in times"> 
     <td>{{weekdays[$index]}}</td> 
     <td ng-repeat-start="dept in time">{{times[$index].service.start}}</td> 
     <td ng-repeat-end>{{times[$index].service.end}}</td> 
    </tr> 
</table>

在这种情况下，我怎么能动态访问的对象？

我的控制器：

.controller("businessHours", function($scope) { 
    $scope.weekdays = ["Sunday", "Monday", "Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"]; 
    $scope.departments = ["sales", "service","accounting","bodyshop","other","parts"]; 

    $scope.times = []; 
    $.each($scope.weekdays, function(index, value) { 
    var dayTimes = {}; 
    $.each($scope.departments, function(index2, value){ 
     console.log(index) 
     dayTimes[value] = {start: '5', end: '6'}; 
    }); 
    $scope.times.push(dayTimes); 
    }); 


})

我要对这个正确或是否有更好的方式来安排我的数据结构？

来源

2016-05-13 o6t9o

遍历在(key,value) in ng-repeat角：

了解更多关于ng-repeat：

<div ng-repeat="(key, value) in myObj"> ... </div>，

在你的情况，更新HTML其中：

<td ng-repeat-start="(key,dept) in time">{{times[$index][key].start}}</td> 
<td ng-repeat-end>{{times[$index][key].end}}</td>

angular.module('app', []) 
 
    .controller('homeCtrl', function($scope) { 
 
    $scope.weekdays = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]; 
 
    $scope.departments = ["sales", "service", "accounting", "bodyshop", "other", "parts"]; 
 

 
    $scope.times = []; 
 
    angular.forEach($scope.weekdays, function(v, i) { 
 
     var dayTimes = {}; 
 
     angular.forEach($scope.departments, function(value, index) { 
 
     console.log(index) 
 
     dayTimes[value] = { 
 
      start: '5', 
 
      end: '6' 
 
     }; 
 
     }); 
 
     $scope.times.push(dayTimes); 
 
    }); 
 
    console.info($scope.times); 
 
    });

td,tr { 
 
    text-align:center; 
 
    min-width: 20px; 
 
}

<html> 
 

 
<head> 
 
    <title>Single Demo</title> 
 
    <script src="//cdn.bootcss.com/jquery/2.2.1/jquery.js"></script> 
 
    <script src="//cdn.bootcss.com/angular.js/1.4.7/angular.js"></script> 
 

 
</head> 
 

 
<body ng-app="app" ng-controller="homeCtrl"> 
 
    <div class="container"> 
 
    <table class="table table-striped"> 
 
     <tr> 
 
     <th></th> 
 
     <th ng-repeat="department in departments" style="vertical-align:top" colspan="2">{{department}}</th> 
 
     </tr> 
 
     <tr ng-repeat="time in times"> 
 
     <td>{{weekdays[$index]}}</td> 
 
     <td ng-repeat-start="(key,dept) in time">{{times[$index][key].start}}</td> 
 
     <td ng-repeat-end>{{times[$index][key].end}}</td> 
 
     </tr> 
 
    </table> 
 
    </div> 
 
</body> 
 

 
</html>

来源

2016-05-13 01:56:27

非常感谢。获得的教训是更多地参考文档。 – o6t9o

ng-repeat对象数组（使用ng-start）

回答

相关问题