$ http计时问题,AngularJS

时间:2016-08-05 19:05:15

标签: javascript angularjs promise angular-promise angularjs-http

有两个问题。我试图从$ http响应中获取一个值,并用它填充一个变量,然后应该更新几个DOM对象。问题是它似乎有一个计时问题,其中调用$ http服务的函数完成,然后变量得到更新,但似乎没有更新它应该更新。我也尝试对变量进行监视,它似乎只是在最初加载页面时触发。我一直在读这一切,似乎无法找到有效的答案。

app.controller('MainCtrl', ['$scope', '$http', 'waciServ', function($scope,      $http, waciServ) {
"use strict";
$scope.currentSource = waciServ.activeSource;

$scope.$watch('waciServ.activeSource', function(newValue, oldValue) {
        $scope.currentSource = newValue;
        console.log('Watcher! ' + newValue);
}/*, true*/);

$scope.getActiveSource = function () {
    $scope.currentSource = waciServ.getStringByName("active_device");
};
}]);

app.service('waciServ', function($http) {
  var self = this;
  this.waciIP = location.host;
  this.activeSource = '';

  this.getStringByName = function (name) {
    $http.post("http://" + self.waciIP + "/rpc/", "method=GetVariableByName&param1=" + name + "&encoding=2")
        .then (function (response) {
            var was_error = self.read(response.data);

            if (was_error == '1') { //active_device is not set
                self.assignVariable(name, "none");
                self.activeSource = "none";
                return self.activeSource;

            } else {
                var varId = parseInt(self.read(response.data));
                $http.post("http://" + self.waciIP + "/rpc/", "method=GetVariableValue&param1=" + varId + "&encoding=2")
                    .then (function (response) {

                        self.activeSource = self.read(response.data);

                        return self.activeSource;      
                });
            }
    }, function (error) {
        console.log("error: " + error.data);
    });
  };
});

我可以在返回触发之前放置一个console.log并看到我有我想要的内容,但是在控制器内的函数中放置的另一个console.log显示为'undefined'。

是什么给出的?提前谢谢。

1 个答案:

答案 0 :(得分:0)

您无需考虑使用观察者。

基本上问题是你没有从服务方法返回承诺。您应该从服务方法返回$http方法调用的承诺。之后使用.then方法调用链承诺&放success& error功能在其中。 (this answer与你的要求很相似,但并不完全相同)

<强>服务

self.getStringByName = function(name) {
  //returned promise from here
  return $http.post("http://" + self.waciIP + "/rpc/", "method=GetVariableByName&param1=" + name + "&encoding=2")
    .then(function(response) {
    var was_error = self.read(response.data);

    if (was_error == '1') { //active_device is not set
      self.assignVariable(name, "none");
      self.activeSource = "none";
      return self.activeSource; //returned data here to chain promise
    } else {
      var varId = parseInt(self.read(response.data));
      //returned promise from here
      return $http.post("http://" + self.waciIP + "/rpc/", "method=GetVariableValue&param1=" + varId + "&encoding=2")
        .then(function(response) {
        self.activeSource = self.read(response.data);
        //returned data from here
        return self.activeSource;
      });
    }
  }, function(error) {
    console.log("error: " + error.data);
  });
};

<强>控制器

app.controller('MainCtrl', ['$scope', '$http', 'waciServ', function($scope,      $http, waciServ) {
"use strict";
   $scope.currentSource = waciServ.activeSource;

   $scope.getActiveSource = function () {
      waciServ.getStringByName("active_device").then(function(source){
         $scope.currentSource = source;
      });
   };
}]);