有沒有辦法在我的AngularJS應用程序啓動時執行一些JavaScript代碼?我有一些需要確保在任何應用程序指令/控制器之前運行的通用代碼。我不想被綁定到路線和ng-view
,我需要這是任何ng-app
的通用解決方案。啓動角度應用程序時執行代碼
我以爲我可以使用模塊配置,我真的嘗試過,但我試圖調用一個服務,這似乎無法訪問模塊負載。
有沒有辦法在我的AngularJS應用程序啓動時執行一些JavaScript代碼?我有一些需要確保在任何應用程序指令/控制器之前運行的通用代碼。我不想被綁定到路線和ng-view
,我需要這是任何ng-app
的通用解決方案。啓動角度應用程序時執行代碼
我以爲我可以使用模塊配置,我真的嘗試過,但我試圖調用一個服務,這似乎無法訪問模塊負載。
你可以這樣做,
var app = angular.module('myApp',[]);
app.run(function($rootScope) {
//.....
});
您可以使用「運行」功能,從模塊API: http://docs.angularjs.org/api/angular.Module
此代碼將注射器創建後執行,所以你應該能夠得到在你正在尋找使用該服務。
您需要使用module.run(initializationFn)
功能,在實際的方法可以取決於服務。您可以注入依賴按通常:
var app = angular
.module('demoApp', [])
.run(['$rootScope', function($rootScope) {
$rootScope.bodyClass = 'loading';
// Etc. Initialize here.
}]);
的例子有初始化依賴於$rootScope
,但你也可以注入服務等
The relevant module.run
documentation是相當簡潔,因爲是其他(優秀)答案。讓我結合成一個更詳細的例子,這也顯示瞭如何在initializationFn
注入factory
創建的服務:
var app = angular.module('demoApp', []);
// Service that we'll also use in the .run method
app.factory('myService', [function() {
var service = { currentItem: { started: new Date() } };
service.restart = function() {
service.currentItem.started = new Date();
};
return service;
}]);
// For demo purposes
app.controller('demoCtrl', ['$scope', 'myService', function($scope, myService) {
$scope.header = 'Demo!';
$scope.item = myService.currentItem;
$scope.restart = myService.restart;
}]);
// This is where your initialization code goes, which
// may depend on services declared on the module.
app.run(['$window', 'myService', function($window, myService) {
myService.restart();
$window.alert('Started!');
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="demoApp" ng-controller='demoCtrl' ng-cloak>
<h1>{{ header }}</h1>
<p>Current item started: {{ item.started }}</p>
<p><button ng-click="restart()">Restart</button></p>
</div>
這讓我對電話到控制器中的競爭條件。看起來並不是所有的控制器都在這個功能執行時就緒。 – Dan
@丹,你在你的控制器上使用解析器嗎? – lyyons
@lyyons這不僅適用於路線嗎? – Dan