Question

我正在开发一个大型的AngularJS应用程序，我试图将所有Ajax代码封装到控制器从中获取数据的各种服务中。问题在于需要知道任何ajax调用的状态并向用户显示正确的信息。可能没有找到数据，当前正在加载数据，或者发生了阻止加载数据的错误。需要向用户显示加载消息，“未找到数据”消息或错误消息。

假设我有ProjectService。理想情况下，如果有一个名为getAllProjects的方法，它将返回一个项目数组。但是那样我就不知道服务器通信发生了什么。

那么如何让控制器知道数据是否已加载，加载或发生错误？我能想出的最好方法是使用下面的伪代码中的回调。有没有更好的方法来完成这样的事情或我可能忽略的任何事情？

感谢。

app.controller( "ProjectController", function( $scope, ProjectService ){

  // Set the initial / default status
  $scope.loadStatus = "loading";

  // Return an empty array initially that will be filled with
  // any data that is returned from the server
  // The callback function will be executed when the ajax call is finished
  $scope.projects = ProjectService.getProjects(function( status ){

    // Alert the controller of a status change
    setStatus( status );

  });

  function setStatus( ){
    $scope.loadStatus = status;

    // ... update the view or whatever is needed when the status changes....
  }

});

app.service( "ProjectService", function( $resource ){

  return {
    getAllProjects: function(){

      // ... load and return the data from the server ...

    }
  };

});

Answer 1

在我们的代码库中，我们一直在做

$scope.flags.loading = true;
$http(...).success(function(){
  $scope.flags.loading = false;
});

是的，这有点简单，但并非所有查询都需要加载覆盖（例如在分页或刷新期间）。这就是我们选择不使用装饰器的原因。

但是，让我们说你想，我可以想到几种方法。让我们说你像我们一样，把你的旗帜放在一个物体里。然后，您可以使用关联来获得优势：

MyService.flags = $scope.flags
... (inside the service) ...
this.flags.loading = true/false;

通过建立引用作为服务的属性，您可以在服务中进行所有状态切换，并避免使控制器混乱。尽管如此，这可能会产生两个或多个密切查询冲突的可能缺点（第一个查询完成并在第二个完成之前删除加载状态）。

出于这个原因，我们找到了设置标志。我们并不真正检查'已加载'，我们只检查数据或使用成功回调。

如何让控制器知道加载数据的状态？

1 个答案: