angularJS使用服務變量

我需要調用控制器中的服務變量。我試圖在服務函數外面調用$scope.userData1.data.name，它是未定義的。如果我將{{userData1}}放在模板Messages Ctrl中，它會顯示包含名稱的所有數據數組。angularJS使用服務變量

我需要使用user_name變量加載i-幀。

angular.module('starter.controllers', []) 


.factory('UserService', function($http) { 
var data; 

     return{ 
      getData: function($http) { 
        return $http.get("http://www.website.com/index.php/id/user/call12"). 
        success(function(response) { 
        /// console.log(JSON.stringify(response)); 
         userData=response.data; 
          return userData; 

        }).error(function(data, status, headers, config) { 
        // log error 
        }); 
      } 
    } 
}) 
.controller('MessagesCtrl',function ($scope, Messages,$http,$ionicPopup,$timeout,$window,UserService,Outbox,$sce) { 

    $scope.userData1 = {}; // updated 
$scope.myCtrl2= function(UserService,$http) { 
UserService.getData($http).then(function(data) { 
    $scope.userData1 = data; 
console.log($scope.userData1.data.name); // USERNAME exist 
    var name= $scope.userData1.data.name; 
}); 
} 

$scope.myCtrl2(UserService,$http); 

var name= $scope.userData1.data.name; //undefined 
$scope.formData4.upload_url = $sce.trustAsResourceUrl("http://www.website.com/index.php/id/user/view_form/"+ name); 

})

模板：

<form ng-controller="MessagesCtrl" ng-disabled="isRequesting"> 
<span class="item item-input" > 
    <span class="input-label">&nbsp;</span> 
<iframe id="iframe-123" src="{{formData4.upload_url}}" style="border: 0px none; height: 80px; margin: auto; width: 100%; overflow: hidden;" frameborder=0></iframe></span>  
</form>

來源

2015-01-21 xyonme

可能重複[如何返回從Ajax響應調用？]（http://stackoverflow.com/questions/14220321/how-to-return-the-an-ajax-call） – 2015-01-21 05:57:11

@AlexisKing嗨Alexis。迴應已經以良好的形式回覆。但是響應的範圍在稱爲Service的函數之外是不可用的。 – xyonme 2015-01-21 06:09:20

問題是因爲當使用構造'MessagesCtrl'時，'$ scope.userData1.data.name'已經在'$ http'的'callback'被觸發之前被評估 - >因爲你沒有初始化'$ scope.userData1'。而另一件關於你的代碼的東西，你不需要因'javascript closure'將'UserService'和$'http'注入到'$ scope.myCtrl2'中。看看這個小提琴，我已經改變你的$ http到$超時，但它應該以同樣的方式工作。希望能幫助到你。 http://jsfiddle.net/themyth92/w0st1y7e/ – themyth92 2015-01-21 07:56:12

你，因爲在這一點上得到了undefined，答案（http.get）尚未從服務器返回。
您必須確保此函數$scope.myCtrl2(UserService,$http)在您可以調用下一行（var name = $ scope.userData1.data.name;）之前收到異步答案。

最好的解決方案是使用promise - $q服務是這樣的：

.controller('MessagesCtrl',function ($scope, Messages,$http,$ionicPopup,$timeout,$window,UserService,Outbox,$sce,$q) { 

    $scope.userData1 = {}; // updated 
    $scope.myCtrl2= function(UserService, $http) 
    { 
     var deferred = $q.defer(); 
    UserService.getData($http).then(function(data) 
     { 
     $scope.userData1 = data; 
     console.log($scope.userData1.data.name); // USERNAME exist 
     var name= $scope.userData1.data.name; 

      deferred.resolve(); 
     }); 
      return deferred.promise; 
    } 

    $scope.myCtrl2(UserService,$http).then(function(){ 
     var name= $scope.userData1.data.name; //Now you got the answer!!! 
     $scope.formData4.upload_url = $sce.trustAsResourceUrl("http://www.website.com/index.php/id/user/view_form/"+ name); 
    }); 
})

的

來源

2015-01-21 08:47:10 cheziHoyzer

非常感謝。我最近學習AJS。我終於得到了答案。 – xyonme 2015-01-21 09:06:26

angularJS使用服務變量

回答

相關問題