Question

创建服务

myApp.factory('serviceHttp', ['$http', function(http) {
  http.get($scope.url).then(function(result){
    serviceVariable = result;
  }
  return serviceVariable;
}

控制器

function appController($scope, serviceHttp){
  $scope.varX = serviceHttp;
  if(serviceHttp){
    // decision X;
  } else {
    // decision Y;
  }
}

视图：

input(ng-if='varX') serviceHttp Exist
input(ng-if='!varX') serviceHttp noExist

上述代码始终显示varX不存在，因为应用程序在http服务调用期间安装。我想使用angular service从服务器注入变量，以便在启动应用程序时做出决定。

Answer 1

如果我理解你，你应该这样做：

 var app = angular.module('YourModule', []);
    app.factory("serviceHttp", function($http) {
        var serviceHttp={};

        serviceHttp.yourGetRequest = function(yourUrl) {

           return $http.get(yourUrl);
       };

        return serviceHttp;
    });

例如，控制器：

        var Controller = function($scope,serviceHttp) {
        $scope.varX='';
        $scope.loading = true;
      var returnArr = serviceHttp.yourGetRequest($scope.url).success(function(dataFromServer) {
$scope.loading = false;
$scope.varX = dataFromServer;
})

};

在视图中你可以使用ng-show，如下所示：

<div ng-show="loading" class="loading"><img src="../styles/ajax-loader-large.gif"></div>

当您的应用程序开始加载时，$ scope.loading = true并显示此div，当您从服务器获取响应时，$ scope.loading变为false并且div不显示。

Answer 2

尝试通过这种方式重写工厂，返回promise：

myApp.factory('serviceHttp', ['$http', function(http) {

   var factory = {
       query: function () {
          var data = http.get($scope.url).then(function(result){
              return result;
           },
          function (result) {
            alert("Error: No data returned");
         });
           return data;
       } 
   }
   return factory;  
}]);

来自控制器：

serviceHttp.query().then(function (result) {
    $scope.varX =  = result;                            
}

以下是演示 Fiddle

在演示中我们使用了其他网址来源

角度服务和http请求

2 个答案: