$http 时间问题，AngularJS

Question

有两个问题。我正在尝试从 $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);
    });
  };
});

我可以在 return 触发之前放置一个 console.log 并看到我有我想要的东西，但是另一个 console.log 放置在控制器内的函数中显示 'undefined'.

什么给了？提前谢谢你。

Answer 1

你不需要考虑使用watcher。

基本上问题是您没有return服务方法的承诺。您应该 return 承诺从您的服务方法调用 $http 方法。此后在方法调用上使用 .then 链式承诺并在其中放置 success 和 error 函数. （与您的要求有点相似但不完全相同）

服务

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;
      });
   };
}]);

$http 时间问题，AngularJS

$http timing issues, AngularJS

javascript

promise

angularjs

angularjs-http

angular-promise