$ httpのタイミング問題、AngularJS

Question

2つの問題があります。私は$ 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は「未定義」を示していることがわかります。

何がありますか？前もって感謝します。

Answer 1

ウォッチャーの使用について考える必要はありません。

基本的に問題は、サービス方法から約束を返さないということです。サービスメソッドから$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; 
     }); 
    }; 
}]);