Question

我已经更新了代码和输出，如下所示：

因此在输出表中，endTime，period和monday是标题。对于EndTime，我想只显示星期一数组的结束时间，但它显示整个数组。如何仅专门显示endTime数据。同期也是如此。

以下是plunker Timetable

我哪里错了？

Index.view.html

  <table class="table table-bordered">
    <tr>
      <th class="endTime" ng-model="monday.endTime">End Time</th>
      <td ng-repeat="d in data track by $index">{{d}}</td>
    </tr>
    <tr>
      <th class="period" ng-model="monday.period">Peroid</th>
      <td ng-repeat="d in data track by $index">{{d}}</td>
    </tr>

    <tr><th class="days">Monday</th></tr>
  </table>

Index.controller.js

        .controller('Admin.IndexController',function($scope,$http,$location,$rootScope,fileUpload)
    {                         
       $scope.college_id='583b01ce6864990011c12ec6';
        var i =0;       
        $http.get('https://student.herokuapp.com/college/'+$scope.college_id)
        .success(function(response){
             // for(var i=0;i<tableLen;i++){
                console.log(response.college);
            $scope.data = response.college.timeTableTemplate;
            console.log($scope.data);
         });           

        })

JSON数组

    "monday": [
    {
      "endTime": "08:50 AM",
      "startTime": "08:00 AM",
      "duration": "50",
      "period": "A"
    },
    {
      "endTime": "08:50 AM",
      "startTime": "08:00 AM",
      "duration": "50",
      "period": "A"
    }

Answer 1

首先将json结构更改为此类型

{  
  "endTime": ["08:50 AM", "08:50 AM", "08:50 AM"],
  "startTime": "[08:00 AM, 08:00 AM, 08:00 AM]",
  "duration": ["50", "50", "50"],
  "period": ["A", "A", "A"]
}

我创建了一个plunker，你可以看到我从json获取数据并显示在table标签中。请阅读此内容并在您的代码中使用。

 <table class="table table-bordered">
    <tr>
      <th>Id</th>
      <th>First Name</th>
      <th>Last Name</th>
    </tr>
    <tr ng-repeat="d in data">
      <td >{{ d.id }}</td>
      <td >{{ d.firstName }}</td>
      <td >{{ d.lastName }}</td>
    </tr>
  </table>

Plunker

如何使用Angular服务从API获取数据到表中？

1 个答案: