Question

我有一个JS对象$ scope.appoinments，里面有3个对象（已完成，已拒绝和待处理）。事实是数据是由我的服务器提供的，但是在我们获取数据之前呈现视图（即使我在控制器的init上调用该函数）。

当我获取数据时，Ç$范围不会将该数据应用于视图上的ngRepeat。如果我使用$scope.$apply()，我会收到错误The digest is in process。

HTML：

<ul class="list">
    <li class="item item-divider">
      Pending Appointments
    </li>
    <li class="item" ng-repeat="pending in appointments.pending">
      {{pending.service_id}}
    </li>
    <li class="item item-divider">
      Completed Appointments
    </li>
    <li class="item" ng-repeat="completed in appointments.completados">
      {{completed.service_id}}
    </li>
    <li class="item item-divider">
      Rejected Appointments
    </li>
    <li class="item" ng-repeat="rejected in appointments.rechazados">
      {{rejected.service_id}}
    </li>
  </ul>

控制器：

closer.controller('appointmentsController', function($scope, Session, CLOSER_SERVER, $http) {
    $scope.session_id = Session.getId();
    $scope.appointments = {
      pending: {},
      completed: {},
      rejected: {}
    };

    $scope.load_appoint = function (){
      var urlMaker = CLOSER_SERVER.url;
      return $http({
        method: 'GET',
        cache: false,
        url: urlMaker
      }).then(function successCallback(response) {
            $scope.appointments = response;
        }, function errorCallback(response) {
             //
        });
    }
    $scope.load_appoint();
});

Response of the server:

    {"pending":[],"completed":[{"service_id":"25","date":"10/01/2016","time":"12:00:00","place":"Undefined","comments":"No comments"}],"rejected":[]}

如何在控制器中修改ngRepeats的数据？

Answer 1

来自文档：

$ http一般用法
$http({
  method: 'GET',
  url: '/someUrl'
}).then(function successCallback(response) {
    // this callback will be called asynchronously
    // when the response is available
  }, function errorCallback(response) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });
响应对象具有以下属性：


data - {string | Object} - 使用转换函数转换的响应体。

status - {number} - 响应的HTTP状态代码。

headers - {function（[headerName]）} - Header getter function。

config - {Object} - 用于生成请求的配置对象。   -statusText - {string} - 响应的HTTP状态文本。

- AngularJS $http service API Reference -- general usage

@nikhil和@Fallenrepear都是对的。

你真的应该使用：

$scope.appointments = response.data;

Answer 2

看看你对$scope.appointments：

的定义

$scope.appointments = {
  pending: {},
  completed: {},
  rejected: {}
};

请注意response.pending，response.completed和respose.rejected如何从服务器返回 arrays （[]），而不是Object（{}）

我假设问题存在于回调（.then）中。使用console.log查看服务器发送的响应，看看您是否无法将数据响应与Angular的预期相匹配。

Answer 3

而不是.then，在http请求中使用.success然后控制台记录您的响应。

AngularJS - 从Controller控制ngRepeat数据

3 个答案:

$ http一般用法