Question

我有一个使用$ resource来提取API数据的服务。我想包含一个isLoaded变量来定义API响应是否已执行。

我的服务目前看起来像这样：

    app.factory('PlayerService', ['$resource', function($resource) {

      return $resource(
        'http://api/endpoint', {player_id: "@player_id"}
      )

}]);

我想添加类似这样的功能（伪代码）......

    app.factory('PlayerService', ['$resource', function($resource) {

      $scope.isLoaded = false;

      return $resource(
        'http://api/endpoint', {player_id: "@player_id"}
      )

      $scope.isLoaded = "true";

}]);

...但我正在努力学习语法。我需要编写一个单独的函数吗？这个逻辑是否需要包含在控制器中而不是服务中？

任何帮助表示感谢。

Answer 1

无需添加isLoaded变量。

$ resourse服务中有一个$ resolved方法可以完成你想做的事情。请参阅https://docs.angularjs.org/api/ngResource/service/ $ resource：

上的文档

$ resolved：在第一次服务器交互完成后为true（也就是说成功或拒绝），之前是假的。知道资源已经解决的数据绑定很有用。

示例：

var test = $resource('http://api/endpoint', {player_id: "@player_id"});
test.get(function(result) {
    console.log(result.$resolved);
});

结果。$ resolved在加载数据后将为true。如果数据没有加载，它将保持为假。

Answer 2

这是为您的应用使用加载程序的另一种方法：

使用angular的此功能： $ http.pendingRequests

我的控制器：

$rootScope.loaderExceptionCount = 0 ;
    $scope.isAnythingLoading = function() {
        console.log($http.pendingRequests, $http);
        return $http.pendingRequests.length > $rootScope.loaderExceptionCount;
    };

这是您的HTML代码，其中isAnythingLoading（）被调用：

<div ng-show="isAnythingLoading()" class="pageLoader">
        <div class="loaderBackdrop"></div>
            <div class="sk-wave">
                    <div class="sk-rect sk-rect1"></div>
                    <div class="sk-rect sk-rect2"></div>
                    <div class="sk-rect sk-rect3"></div>
                    <div class="sk-rect sk-rect4"></div>
                    <div class="sk-rect sk-rect5"></div>
            </div>
        </div>
<div ui-view=""></div>

将'isLoading'变量添加到$ resource service（Angular）

2 个答案: