레이지 로딩 각도RequireJS가 포함된 JS 모듈

레이지 로딩 각도RequireJS가 포함된 JS 모듈

Dan Wahlin의 훌륭한 기사 덕분에 Angular의 컨트롤러와 서비스를 게으르게 로딩할 수 있었습니다.그러나 독립 모듈을 게으르게 로드하는 방법은 없는 것 같습니다.

내 질문을 더 잘 설명하기 위해 앱이 있다고 가정하면 Require가 없는 아래와 같은 구조가 됩니다.JS:

// Create independent module 'dataServices' module with 'Pictures' object
angular.module("dataServices", []).factory("Pictures", function (...) {...});

// Create 'webapp' ng-app, with dependency to 'dataServices', defining controllers
angular.module("webapp", ['dataServices'])
.controller("View1Controller", function (...) {...})
.controller("View2Controller", function (...) {...});

다음은 Require가 있는 샘플 앱입니다.플렁커의 JS:
http://plnkr.co/aiarzVpMJchYPjFRrkwn

문제의 핵심은 Angular가 의존성을 추가하는 것을 허용하지 않는다는 것입니다.ng-app사건의 발단이 된 후결과적으로 나의 해결책은angular.injector의 예를 검색해 보다Picture내가 사용할 물건View2Controller.봐js/scripts/controllers/ctrl2.js파일.

이것은 저에게 두 가지 문제를 야기합니다.

1. 주입된 서비스는 각도를 벗어나 실행되므로 모든 비동기 호출은 $scope로 끝나야 합니다.$apply()
2. 일부 개체는 표준 각도 구문을 사용하여 주입할 수 있고 다른 개체는 주입기를 명시적으로 사용해야 하는 지저분한 코드입니다.

Require를 사용하여 독립 모듈을 레이지 로드하는 방법을 알아낸 사람이 있습니까?JS와 일반적인 각도 의존성 주입 구문을 사용할 수 있도록 이 모듈을 각도로 연결하는 방법은 무엇입니까?

참고:
문제는 독립 모듈의 게으른 로딩에 관한 것입니다.이 예에 대한 간단한 해결책은 캐시된 $프로바이더를 사용하여 "그림" 개체를 만드는 것입니다.ng-app.config하지만 그건 제가 찾고 있는게 아니에요다음과 같은 타사 모듈과 함께 작동하는 솔루션을 찾고 있습니다.angular-resource.

나는 다음과 같은 나만의 구현을 완료했습니다.angularAMD다음은 이를 사용하는 샘플 사이트입니다.

http://marcoslin.github.io/angularAMD/

구성 기능과 순서가 맞지 않는 모듈 정의를 처리합니다.

이것이 다른 사람들이 Require를 도와줄 무언가를 찾는 데 도움이 될 수 있기를 바랍니다.JS 및 각도JS 통합.

GitHub에서 내 프로젝트 보기: angular-require-lazy

이 프로젝트는 아이디어를 보여주고 토론에 동기를 부여하기 위한 것입니다.하지만 당신이 원하는 것을 합니다. (check exposes-view.js, ng-grid loads lazed).

저는 댓글, 아이디어 등에 관심이 많습니다.

---

(EDIT) ng-grid Angular 모듈은 다음과 같이 레이지 로드됩니다.

1. expenses-view.js느릿느릿 짐을 싣습니다./expenses경로가 활성화됩니다.
2. expenses-view.jsng-grid를 종속성으로 지정하므로 RequireJs가 ng-grid를 먼저 로드합니다.
3. ng-grid가 전화를 하는 사람입니다.angular.module(...)

이를 달성하기 위해 실물을 교체(대리)했습니다.angular.module게으름을 지지하는 나만의 방법.bootstrap.js 및 route-config.js (기능 참조)initLazyModules()그리고.callRunBlocks()).

이 구현에는 다음과 같은 단점이 있습니다.

1. 구성기능이 아직 구현되지 않았습니다.구성 시간 의존성을 느릿느릿 제공하는 것이 가능한지 모르겠습니다.
2. 순서는 정의에서 중요합니다.서비스 A가 B에 의존하지만 모듈에서 B 뒤에 A가 정의되면 DI는 실패합니다.이는 lazy Angular 프록시가 정의를 실행하기 전에 종속성이 해결되도록 하는 실제 Angular와 달리 정의를 즉시 실행하기 때문입니다.

Node.js 모듈은 이러한 게으른 로딩을 수행하는 방법을 정의하는 것처럼 보이지만, 다른 답변의 방법이나 의존성을 하드코딩하는 방법에 비해 성능 면에서 어떻게 작동하는지 잘 모르겠습니다.이에 대한 어떤 정보라도 주시면 감사하겠습니다.한가지 흥미로운 것은 다른 대답들이 필요하다는 것입니다.RequireJS수술을 하는 동안ocLazyLoad안 그래요.

은 처럼 보입니다.ocLazyLoad포함하는 모듈이 이미 인스턴스화된 후 종속성을 주입하는 다른 공급자를 정의합니다.모듈 로딩 및 제공과 같은 일부 낮은 레벨의 Angular 동작을 본질적으로 복제함으로써 이를 수행하는 것으로 보이며, 따라서 이는 매우 복잡해 보입니다.거의 모든 코어 Angular 모듈을 종속성으로 추가한 것 같습니다.$compileProvider,$q,$injector,ng, 그 외에도 많은 것들이.

언급URL : https://stackoverflow.com/questions/19134023/lazy-loading-angularjs-modules-with-requirejs