自動引導Angular應用程序注入到web應用程序

我想在現有的非Angular webapp中使用Angular，將應用程序注入頁面並綁定到特定的div。由於該應用可能需要將多個Angular應用綁定到不同的div（根據需要顯示和隱藏它們），因此我似乎無法使用ngApp並且必須執行手動引導。但是，這需要做一些像下面這樣醜陋的事情，在這裏我必須定義一個boostrap函數，我從應用程序中調用我將Angular應用程序插入到的函數。有沒有辦法避免在這種情況下調用doBootstrap？我基本上喜歡注入並自動啓動應用程序。這在初始加載時不會發生，所以document.ready樣式解決方案不是一個選項。此外，避免在div上定義一個ng-controller會很好，但這是一個較小的問題。自動引導Angular應用程序注入到web應用程序

angular.module('TestApp', []) 
.controller('TestAppController', ['$scope', function ($scope) { 
    document.getElementById('myDiv').innerText = 'testing'; 
}]); 

var doBootstrap = function() { 
    angular.bootstrap(document.getElementById('myDiv'), ['TestApp']); 
};

來源

2014-10-08 praetorian1

原來，我應該已經定義模塊運行後手動啓動代碼（即刪除功能包裹它）。

angular.module('TestApp', []) 
.controller('TestAppController', ['$scope', function ($scope) { 
    document.getElementById('myDiv').innerText = 'testing'; 
}]); 

angular.bootstrap(document.getElementById('myDiv'), ['TestApp']);

來源

2014-10-09 09:57:39 praetorian1

如何：

angular.element(document).ready(function() { 
    angular.bootstrap(document, ['TestApp']); 
});

請參閱本文檔也：https://docs.angularjs.org/guide/bootstrap

來源

2014-10-08 20:24:37

感謝您的回覆。 Angular應用程序需要加載以響應某些事件，所以document.ready並不是真正的選項，因爲在注入Angular JS的時候文檔已經加載。 – praetorian1 2014-10-08 20:27:25

自動引導Angular應用程序注入到web應用程序

回答

相關問題