Question

我需要使用ng-repeat和ng-bind将数据显示到表格中，但我尝试过的内容并没有显示任何数据，我试过的代码出错了哪里？ HTML：

<tbody id="ngDowntimeBody">
<tr ng-repeat="previousdowntime in GetPreviousDowntimeEvents.PreviousDowntimeEvents">
     <td ng-bind="previousdowntime.CategoryId"></td>
      <td ng-bind="previousdowntime.StartTime"></td>
      <td ng-bind="previousdowntime.EndTime"></td>
      <td ng-bind="previousdowntime.Comment"></td>
 </tr>
</tbody>

JS：

function GetPreviousDowntimeEvents($http) {
     var self = this;

     self.PreviousDowntimeEvents = [];
     self.AjaxData = ngHesto.Ajax.Get($http
        , {
          url: PREVIOUS_DOWNTIME_EVENTS
          , success: function (data) {
           self.PreviousDowntimeEvents = data.data[0];
           console.log(self.PreviousDowntimeEvents);
            }
       });
 }

var ngAppModule = angular.module('myApp', []);
ngAppModule.controller('DowntimeController', ['$scope','$http', function ($scope, $http) {
    $scope.GetPreviousDowntimeEvents = new GetPreviousDowntimeEvents($http);  
}]);

数据无法显示

这是我回复的回复：

{EventId: "10", DepartmentId: "7", CategoryId: "10", StartTime: "2014-08-19T10:00:00", EndTime: "2014-08-19T10:10:00",Comment:"Test"}

Answer 1

JS

function GetPreviousDowntimeEvents($http) {
     var self = this;

     self.PreviousDowntimeEvents = [];
     self.AjaxData = ngHesto.Ajax.Get($http
        , {
          url: PREVIOUS_DOWNTIME_EVENTS
          , success: function (data) {
           self.PreviousDowntimeEvents = data.data;
           console.log(self.PreviousDowntimeEvents);
            }
       });
 }

var ngAppModule = angular.module('myApp', []);
ngAppModule.controller('DowntimeController', ['$scope','$http', function ($scope, $http) {
    $scope.GetPreviousDowntimeEvents = new GetPreviousDowntimeEvents($http);  
}]);

HTML

  <tbody id="ngDowntimeBody">
                       <tr ng-repeat="previousdowntime in GetPreviousDowntimeEvents.PreviousDowntimeEvents">
                       <td>{{previousdowntime.CategoryId}}</td>
                       <td>{{previousdowntime.StartTime}}</td>
                       <td>{{previousdowntime.EndTime}}</td>
                       <td>{{previousdowntime.Comment}}</td>
                   </tr>
              </tbody> 
         </table>

Answer 2

我想你不需要这里的新工作人员

而不是

ngAppModule.controller('DowntimeController', ['$scope','$http', function ($scope, $http) {
    $scope.GetPreviousDowntimeEvents = new GetPreviousDowntimeEvents($http);  
}]);

使用

ngAppModule.controller('DowntimeController', ['$scope','$http', GetPreviousDowntimeEvents]);

或在GetPreviousDowntimeEvents函数中返回一些内容

function GetPreviousDowntimeEvents($http) {
 //...
  return self;
}

如何使用AngularJS使用ng-bind和ng-repeat进行显示

2 个答案: