[angular] Angular-CLI를 사용하여 특정 모듈에 컴포넌트 작성

Program / 글쓴이

나는 angular-cli를 사용하기 시작했고 이미하고 싶은 것에 대한 답을 찾기 위해 많은 것을 읽었습니다 … 성공하지 않기 때문에 여기에 왔습니다.

새 모듈에 컴포넌트를 작성하는 방법이 있습니까?

예 : ng g module newModule

ng g component newComponent (이 컴포넌트를 newModule에 추가하는 방법 ??)

angular-cli 기본 동작은 모든 새 구성 요소를 안에 넣는 것 app.module입니다. 구성 요소를 배치 할 위치를 선택하여 분리 된 모듈을 만들 수 있으며 내부에 모든 구성 요소가 포함되어 있지 않습니다 app.module. angular-cli를 사용하여 수행 할 수 있습니까? 아니면 수동으로 수행해야합니까?

답변

모듈의 일부로 구성 요소를 작성하려면

  1. ng g module newModule 모듈을 생성하기 위해
  2. cd newModule디렉토리를 newModule폴더 로 변경
  3. ng g component newComponent 구성 요소를 모듈의 하위로 작성합니다.

업데이트 : 각도 9

이제 컴포넌트를 생성 할 때 어떤 폴더에 있는지는 중요하지 않습니다.

  1. ng g module NewMoudle 모듈을 생성합니다.
  2. ng g component new-module/new-component NewComponent를 생성합니다.

참고 : Angular CLI는 새 모듈 / 새 구성 요소를 볼 때 새 모듈-> NewModule 및 새 구성 요소-> NewComponent와 일치하는 경우를 이해하고 변환합니다. 처음에는 혼란 스러울 수 있으므로 # 2의 이름을 모듈 및 구성 요소의 폴더 이름과 일치시키는 쉬운 방법입니다.

답변

ng g component nameComponent --module=app.module.ts

답변

글을 쓰는 시점에서 Alexander Ciesielski의 답변이 정확한지 확실하지 않지만 더 이상 작동하지 않는지 확인할 수 있습니다. Angular CLI를 실행하는 프로젝트의 디렉토리는 중요하지 않습니다. 입력하면

ng g component newComponent

컴포넌트를 생성하고 app.module.ts 파일로 가져옵니다.

CLI를 사용하여 다른 모듈로 자동으로 가져올 수있는 유일한 방법은 다음을 지정하는 것입니다.

ng g component moduleName/newComponent

여기서 moduleName은 프로젝트에서 이미 정의한 모듈입니다. moduleName이 존재하지 않으면 componentName / newComponent 디렉토리에 컴포넌트를 배치하지만 여전히 app.module로 가져옵니다.

답변

cli를 사용하여 최상위 모듈 폴더 내에 구성 요소를 생성하고 구성 요소가 모듈의 선언 컬렉션을 자동으로 추가하는 방법을 보여주는 답변을 찾지 못했습니다.

모듈을 만들려면 다음을 실행하십시오.

ng g module foo

foo 모듈 폴더 내에 컴포넌트를 작성하고 foo.module.ts의 선언 콜렉션에 추가하려면 다음을 실행하십시오.

ng g component foo/fooList --module=foo.module.ts

그리고 cli는 다음과 같이 모듈과 컴포넌트를 스캐 폴딩합니다 :

여기에 이미지 설명을 입력하십시오

-각도 클리의 새 버전 편집은 다르게 작동합니다. 1.5.5는 모듈 파일 이름을 원하지 않으므로 v1.5.5의 명령은

ng g component foo/fooList --module=foo

답변

아래 명령을 시도해보십시오.

ng -> Angular
g  -> Generate
c  -> Component
-m -> Module

그런 다음 명령은 다음과 같습니다.

ng g c user/userComponent -m user.module

답변

Angular v4 이상의 경우 다음을 사용하십시오.

ng g c componentName -m ModuleName

답변

이것이 나를 위해 일한 것입니다.

1 -->  ng g module new-module

2 -->  ng g c new-module/component-test --module=new-module/new-module.module.ts

디렉토리없이 구성 요소를 생성하려면 --flat 플래그를 사용하십시오 .