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

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

---

나는 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 구성 요소를 모듈의 하위로 작성합니다.

---

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

---

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

1 -->  ng g module new-module

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

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

---

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

ng g c componentName -m ModuleName

---

1. 먼저 실행하여 모듈을 생성합니다.

ng g m modules/media

이렇게하면 폴더 media내부에 모듈이 생성됩니다 modules.

2. 둘째,이 모듈에 추가 된 컴포넌트를 생성합니다

ng g c modules/media/picPick --module=modules/media/media.module.ts

the first part of the command ng g c modules/media/picPick will generate a component folder called picPick inside modules/media folder witch contain our new media module.

the second part will make our new picPick component declared in media module by importing it in the module file and appending it to declarations array of this module.

---

I am having the similar issues with multiple modules in application. A component can be created to any module so before creating a component we have to specify the name of the particular module.

'ng generate component newCompName --module= specify name of module'

---

Use this simple command:

ng g c users/userlist

users: Your module name.

userlist: Your component name.

---

According to Angular docs the way to create a component for specific module is,

ng g component <directory name>/<component name>

"directory name" = where the CLI generated the feature module

Example :-

ng generate component customer-dashboard/CustomerDashboard

This generates a folder for the new component within the customer-dashboard folder and updates the feature module with the CustomerDashboardComponent

---

I created component based child module with specific Root Folder

That cli command below i specified,please check out

ng g c Repair/RepairHome -m Repair/repair.module

Repair is Root Folder of our child module

-m is --module

c for compount

g for generate

---

Add a component to the Angular 4 app using Angular CLI

To add a new Angular 4 component to the app, use command ng g component componentName. After execution of this command, Angular CLI adds a folder component-name under src\app. Also, the references of the same is added to src\app\app.module.ts file automatically.

A component shall have a @Component decorator function followed by a class which needs to be exported. The @Component decorator function accepts meta data.

Angular CLI를 사용하여 Angular 4 앱의 특정 폴더에 구성 요소 추가

특정 폴더에 새 구성 요소를 추가하려면 다음 명령을 사용하십시오. ng g component folderName/componentName

---

.angular-cli.json에 선언 된 여러 개의 앱이있는 경우 (예 : 기능 모듈에서 작업하는 경우)

"apps": [{
    "name": "app-name",
    "root": "lib",
    "appRoot": ""
}, {...} ]

당신은 할 수 있습니다 :

ng g c my-comp -a app-name

-a는 --app (이름)를 나타냅니다.

---

먼저 실행하십시오 ng g module newModule. 그런 다음 실행ng g component newModule/newModule --flat

---

이 특정 명령을 사용하여 모듈 내부에서 구성 요소를 생성합니다.

ng g c <module-directory-name>/<component-name>

이 명령은 모듈의 로컬 구성 요소를 생성합니다. 또는 먼저 입력하여 디렉토리를 변경할 수 있습니다.

cd <module-directory-name>

그런 다음 구성 요소를 작성하십시오.

ng g c <component-name>

참고 : <>로 묶인 코드는 사용자 별 이름을 나타냅니다.

---

모듈 수준으로 이동하여 아래 명령을 입력하십시오.

ng g component "path to your component"/NEW_COMPONENT_NAME -m "MODULE_NAME"

예 :

ng g component common/signup/payment-processing/OnlinePayment -m pre-login.module.ts

참고 URL : https://stackoverflow.com/questions/40649799/create-component-to-specific-module-with-angular-cli