2016-08-10 3 views
11

방금 ​​angular2-app을 새로운 RC5으로 업데이트 중입니다. 나는 꽤 멀리있어, 모든게 괜찮은 것 같지만, 지금은 NgModules으로 다시 구성하고 싶다. 한 가지를 보았다. 다른 모듈의 여러 다른 구성 요소에 걸쳐 구성 요소 ("ComponentA")를 사용했습니다 (ModuleA & ModuleB) .모듈 간 각도 2 RC5 공유 구성 요소

은 즉시 그런 식으로 사용할 때, 나는 내려면 :

catch되지 않은 유형 ComponentA 2 개 모듈의 선언의 일부입니다 ModuleA 및 ModuleB!

오류.

내가 아는 한, 그걸 해결할 수있는 유일한 방법은 Shared-Module을 내 모든 일반적인 것들과 함께 사용하는 것입니다. 맞습니까? 모듈간에 구성 요소를 공유하는 더 쉬운 방법이 있습니까?

+0

[이] (https://medium.com/@alihaghighatkhah/creating-a-shared-module-in-angular2-d281632316ff#.w0dpsvf48) 문서는 당신을 도울 수있는 링크를 참조 . – Reyraa

답변

22

: 사전에

덕분에 당신은 공유 구성 요소에 대한 모듈을 만들고이 구성 요소를 사용하려는 경우이 모듈을 가져올 수 있습니다.

오류 메시지는 구성 요소 (또는 지시문 또는 파이프)가 정확히 하나의 모듈 directives에만 나열 될 수 있다고 말합니다.

재사용하려면 해당 모듈을 사용하려는 모듈의 @NgModule({imports: [...]})에 해당 모듈을 추가해야합니다.

+0

나는 그것이 유일한 대답이었던 것이 두려웠다.;) 번개 빠른 응답에 대해 감사한다 [그렇게하자. 바로하자.] –

+1

몇 가지 코드 예? – albanx

+2

https://angular.io/docs/ts/latest/guide/ngmodule.html –

4

모든 공유 구성 요소를 포함하는 모듈을 만듭니다.

이렇게하면 다른 모듈에서도 쉽게 가져올 수 있습니다.

프로 팁 : 모듈에 라우팅을 넣은 다음 재미있게 시도해보십시오. 그 중 하나를 느리게로드하십시오.

은 그럼 당신은 생각하는 것 : 당신은 공유 모듈을 사용할 필요가

+0

Hehe, 답장을 보내 주셔서 감사합니다. 공유 모듈을 추가 한 후에 나는 그것이 프로임을 깨달았습니다. 결국 좋은 일입니다. 게으른 로딩은 다음에 할 일 목록에 있습니다. –

+2

도움이된다면, Angular2, Webpack2, Typescript2 및 Angular-Material을 사용하여 데모 어플리케이션을 만드는 Github에 대한 레포를 만들었습니다. 나는 모든 재질 - 구성 요소를 공유 ngModule에 결합하여 사용하는 응용 프로그램입니다. Docker 컨테이너 내에서 repo를 실행할 수도 있습니다. https://github.com/spock123/angular2-webpack2-typescript2 – Spock

+1

나는이 접근법을 따르고있다. 내 공유 모듈에는 예 : 내 머리글과 바닥 글 구성 요소. 하지만 공유 모듈에는 라우팅 기능이 없기 때문에 헤더에 라우터 링크를 사용할 수 없습니다. 그걸 어떻게 고쳐 주겠어? 각 모듈에 대해 별도의 헤더 구성 요소가 있습니까? – Boland

4

"whoaaaaa 모듈 cooooolllll 있습니다."

SharedModule은 일반적으로 사용되는 구성 요소, 지시문 및 파이프를 다른 많은 모듈의 구성 요소 템플리트에 사용할 수 있도록하기 위해 존재합니다.

&을 가져 와서 원하는 다른 모듈로 가져와야합니다. 자세한 내용은

shared module

관련 문제