이미 부트 스트랩 된 각도 모듈에 늦은 종속성을 주입하는 방법이 있습니까? 제가 의미하는 바는 다음과 같습니다.
다음과 같이 정의 된 사이트 전체 각도 앱이 있다고 가정합니다.
// in app.js
var App = angular.module("App", []);
그리고 모든 페이지에서 :
<html ng-app="App">
나중에 현재 페이지의 요구 사항에 따라 논리를 추가하기 위해 앱을 다시 엽니 다.
// in reports.js
var App = angular.module("App")
App.controller("ReportsController", ['$scope', function($scope) {
// .. reports controller code
}])
이제 (같은 논리의 그 주문형 비트의 하나는 자신의 의존성을 필요로 말을 ngTouch
, ngAnimate
, ngResource
, 등). 기본 앱에 어떻게 연결할 수 있습니까? 이것은 작동하지 않는 것 같습니다.
// in reports.js
var App = angular.module("App", ['ui.event', 'ngResource']); // <-- raise error when App was already bootstrapped
나는 내가 모든 것을 미리 할 수 있다는 것을 알고있다.
// in app.js
var App = angular.module("App", ['ui.event', 'ngResource', 'ngAnimate', ...]);
또는 모든 모듈을 자체적으로 정의한 다음 모든 것을 기본 앱에 삽입합니다 ( 자세한 내용은 여기 참조 ).
// in reports.js
angular.module("Reports", ['ui.event', 'ngResource'])
.controller("ReportsController", ['$scope', function($scope) {
// .. reports controller code
}])
// in home.js
angular.module("Home", ['ngAnimate'])
.controller("HomeController", ['$scope', '$http', function($scope, $http){
// ...
}])
// in app.js, loaded last into the page (different for every page that varies in dependencies)
var App = angular.module("App", ['Reports', 'Home'])
하지만 이렇게하려면 현재 페이지의 종속성으로 매번 앱을 초기화해야합니다.
나는 기본을 포함하는 것을 선호 app.js
모든 페이지를 간단하게 각 페이지 (에 필요한 확장을 도입 reports.js
, home.js
는 I 추가 부트 스트랩 로직마다 또는 제거 뭔가를 수정하지 않고, 등).
앱이 이미 부트 스트랩되었을 때 종속성을 도입하는 방법이 있습니까? 이를 수행하는 관용적 방법 (또는 방법)은 무엇입니까? 나는 후자의 해결책에 기대고 있지만 내가 설명한 방식이 또한 수행 될 수 있는지보고 싶었다. 감사.
답변
다음과 같이 해결했습니다.
앱을 다시 참조하십시오.
var app = angular.module('app');
그런 다음 새 요구 사항을 요구 사항 배열로 푸시합니다.
app.requires.push('newDependency');
답변
단순 … 다음과 같은 getter를 사용하여 모듈의 인스턴스를 가져옵니다. var app = angular.module ( “App”);
그런 다음 다음과 같이 “requires”컬렉션에 추가합니다. app.requires [app.requires.length] = “ngResource”;
어쨌든 이것은 나를 위해 일했습니다. 행운을 빕니다!
답변
Angular JS Google 그룹의이 제안에 따르면 이 기능은 현재 존재하지 않습니다. 핵심 팀이이 기능을 추가하기로 결정하고 직접 사용할 수 있기를 바랍니다.
답변
한 번에 여러 종속성을 추가하려는 경우 다음과 같이 푸시로 전달할 수 있습니다.
<script>
var app = angular.module('appName');
app.requires.push('dependencyCtrl1', 'dependencyService1');
</script>
답변
나는 이것이 오래된 질문이라는 것을 알고 있지만 아직 유효한 답변이 제공되지 않았기 때문에 어떻게 해결했는지 공유하기로 결정했습니다.
이 솔루션에는 Angular 분기가 필요하므로 더 이상 CDN을 사용할 수 없습니다. 그러나 수정이 매우 적기 때문에 Angular 에이 기능이 존재하지 않는 이유에 놀랐습니다.
이 질문에 대한 다른 답변 중 하나에 제공된 Google 그룹 링크를 따라갔습니다 . 문제를 해결 한 다음 코드를 찾았습니다.
instanceInjector.loadNewModules = function (mods) {
forEach(loadModules(mods), function(fn) { instanceInjector.invoke(fn || noop); });
};
이 코드를 각도 1.5.0 소스 코드의 4414 행에 추가했을 때 ( createInjector
함수 내부 , return instanceInjector;
명령문 앞 ) 이와 같이 부트 스트랩 후 종속성을 추가 할 수있었습니다 $injector.loadNewModules(['ngCookies']);
.
답변
버전 1.6.7부터 이제 .NET을 사용하여 앱을 부트 스트랩 한 후 모듈을 지연로드 할 수 있습니다 $injector.loadNewModules([modules])
. 다음은 AngularJS 문서에서 가져온 예입니다.
app.factory('loadModule', function($injector) {
return function loadModule(moduleName, bundleUrl) {
return getScript(bundleUrl).then(function() { $injector.loadNewModules([moduleName]); });
};
})
주위에 몇 가지 문제가 있으므로 loadNewModules에 대한 전체 문서를 읽으 십시오.