2013-04-25 54 views
0

不(總是)可在我的應用程序定義,我有:

var myVtModule = angular.module('vtApp', ['myAppDev','mongoAPI']); 
myVtModule.run(function($rootScope, $location, Shop){ 
    $rootScope.shopData = {}; 
    Shop.getShop(function(response){ 
     $rootScope.shopData = response; 
    }); 
}) 

店是從服務器獲取數據的服務,它的工作原理。問題是,在控制器中,我並不總是可以訪問shopData,有時是空的,有時可以正常工作。

function SupportCtrl($rootScope, $scope) { 
    console.log ($rootScope.shopData); 
} 

爲什麼在它從服務接收到響應時不更新?我不能把Shop.getShop的,因爲我需要它無處不在控制器...

回答

0

如果你需要在你的控制器的結果,你應該跳過myVtModule.run和做這樣的事情,而不是:

function SupportCtrl($scope, Shop) { 
    Shop.getShop(function(response){ 
    console.log (response); 
    //do something, put response in $scope or $scope.$rootScope etc... 
    }); 
} 
+0

我幾乎在每一個控制器使用它,我不能這樣做。這就是爲什麼我需要將它從$ rootScope提供到任何地方。 – 2013-04-25 14:06:20

1

我的建議是使用控制器繼承和服務,以便您的子控制器始終可以訪問該商店。這裏是一個演示:

http://beta.plnkr.co/edit/DtjwLMi3jHCdzThEJDNn?p=preview

代碼:

angular.module('myApp', ['myApp.services']); 

function MainCtrl($scope, ShopService) { 
    $scope.shop = ShopService.getShop(); 
} 
function ChildCtrl($scope) { 
} 
angular.module('myApp.services', []). 
    factory('ShopService', function ($rootScope) { 
     var shop = { 
      storename: 'your store' 
     }; 

     var service = { 
       getShop: function() { 
       return shop; 
       } 
     } 

     return service; 
    }); 

HTML,設置了兒童控制器間的關係:

<html ng-app="myApp" > 
<head> 
    <meta charset="utf-8"> 
    <title>AngularJS Plunker</title> 
    <link rel="stylesheet" href="style.css"> 
    <script>document.write("<base href=\"" + document.location + "\" />");</script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js"></script> 
    <script src="app.js"></script> 
</head> 
<body ng-controller="MainCtrl"> 
    The store is {{shop.storename}} 
    <div ng-controller="ChildCtrl"> 
     The store name is: {{shop.storename}} 

    </div> 
</body> 
</html> 

你會發現shop是提供給孩子因爲父範圍檢索它。我建立了服務,以便讓它可測試/等。除了繼承之外,您可以輕鬆地將ShopService注入每個控制器並讓他們撥打電話,但是如果您有許多控制器可能會變得乏味。

的範圍繼承一些更多的信息:

can i inherit a parent controller's variables? http://docs.angularjs.org/guide/dev_guide.mvc.understanding_controller

0

你的NG-控制器作用域的所有prototypically從rootScope(最終)繼承,所以他們都可以訪問到你rootScope定義的任何對象。由於從服務器檢索數據是異步操作,因此您的控制器可能會在服務器數據返回之前執行。您可以在控制器中使用$watch來確定數據何時可用。但是,如果您只是希望在數據可用時更新視圖,則不必使用$ watch。數據可用時,Angular應自動更新視圖。例如,

function SupportCtrl($rootScope, $scope) { 
    $scope.shopData = $rootScope.shopData; 
} 

然後在您的視圖:

<div ng-controller="SupportCtrl">shopData = {{shopData}}</div> 

Fiddle - 我模擬使用$timeout服務器延遲。請注意,在撥弄我也用angular.copy()更新控制器具有參考,而不是分配$rootScope.shopData到一個新的/不同的數組:

app.run(function($rootScope, $timeout){ 
    $rootScope.shopData = []; 
    $timeout(function() { 
     angular.copy([{d1: 'data1', d2: 'data2'}], $rootScope.shopData); 
    }, 2000); 
}); 
相關問題