"CoreModule"에서 선언 된 구성 요소를 사용할 수 없지만 서비스를 사용할 수 있습니다.

Question

특정 모듈의 인스턴스를 하나만 가질 수 있도록 각도 문서를 따르려고합니다. 특히 CoreModule 및 SharedModule 섹션

단지 게으른 사용하려고 할 때에 내 문제가 오는 CoreModule

에 선언 된 UserService를 참조 할 수 HeroesModule 및 HeroComponent을로드 AppModule, 한 번 CoreModule을 가져 오기위한 작품 위의 링크의 맨 아래에있는 데모 「CoreModule」로부터 선언 및 export 된 Component.

예를 들어 기본은 HeroComponent처럼 작동 :

// Exact copy except import UserService from core 
import { Component } from '@angular/core'; 

import { HeroService } from './hero.service'; 
import { UserService } from '../core/user.service'; 

@Component({ 
    template: ` 
    <h2>Heroes of {{userName}}</h2> 
    <router-outlet></router-outlet> 
    `, 
    providers: [ HeroService ] 
}) 
export class HeroComponent { 
    userName = ''; 
    constructor(userService: UserService) { 
    this.userName = userService.userName; 
    } 
} 

하지만 난 그것을 수정하면 그것은 내가 복사 한 'app-title' is not a known element

// Exact copy except import UserService from core 
import { Component } from '@angular/core'; 

import { HeroService } from './hero.service'; 
import { UserService } from '../core/user.service'; 

@Component({ 
    template: ` 
    <h2>Heroes of {{userName}}</h2> 
    <router-outlet></router-outlet> 
    <app-title></app-title> 
    `, 
    providers: [ HeroService ] 
}) 
export class HeroComponent { 
    userName = ''; 
    constructor(userService: UserService) { 
    this.userName = userService.userName; 
    } 
} 

오류와 함께 깨 CoreModule에 선언 된 app-title 구성 요소를 포함 아래 angular.io 문서의 예를 참조하고 ,

를 포함하도록 app/hero/hero.component.ts 템플릿을 수정해야합니다.

예 : 응용 프로그램을로드 한 후

https://plnkr.co/edit/SZOEvdRCT23S4DfbGmut?p=preview

편집을 "영웅"버튼을 클릭 : 두 번째 예를 들어, "연락처"버튼을 클릭

https://stackblitz.com/edit/angular-2ym6ya?file=contact/contact.component.html

어떤 제안 얻기에 응용 프로그램을로드 한 후 CoreModule의 구성 요소가 지연로드 모듈에서 작동하는지 또는이 작동을 기대해서는 안되는 이유에 대한 정보를 크게 높이 평가할 수 있습니다.

Answer 1

모듈의 구성 요소, 지시문 또는 파이프를 사용하려면 모듈을 imports: [...]에서 모듈을 사용하는 모듈에 추가해야합니다.

서비스는 AppModule 또는 가져온 게으른로드 된 모듈의 루트 범위에서 제공되거나 가져 오는 경우 응용 프로그램 루트 범위에서 끌어 올 수 있습니다 (지연로드 모듈은 응용 프로그램 루트 범위에 하위 범위를 도입 함). 따라서 한 번만 가져와야합니다.

https://stackblitz.com/edit/angular-ds2rce?file=core%2Fcore.module.ts