简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
집 > 웹 프론트엔드 > JS 튜토리얼 > 본문

Angular CLI가 경로를 생성하는 방법

php中世界最好的语言
풀어 주다： 2018-06-14 10:34:28
원래의
1306명이 탐색했습니다.

이번에는 Angular CLI가 경로를 생성하는 방법과 Angular CLI가 경로를 생성할 때 주의 사항이 무엇인지 보여드리겠습니다. 실제 사례를 살펴보겠습니다.

애플리케이션에 대한 경로를 생성합니다.

먼저 프로젝트를 생성합니다:

ng new my-routing --routing
로그인 후 복사

두 개의 모듈이 생성되는 것을 볼 수 있습니다.

라우팅 모듈을 보세요:

그리고 앱을 보세요 모듈:

AppRoutingModule을 가져왔습니다.

app.comComponent.html을 다시 살펴보세요.

router-outlet이 매우 훌륭하게 작성되었습니다.

다음은 두 가지 구성 요소를 더 생성합니다.

ng g c dashboard
ng g c order
로그인 후 복사

그런 다음 app-routing.module에서 라우팅을 설정하세요:

html을 다시 수정하세요:

애플리케이션 실행: ng Serve -o

아니요.

애플리케이션에 여러 모듈이 있는 상황의 경우.

라우팅 모듈로 모듈을 생성합니다(-d 매개변수를 사용하면 먼저 생성될 파일을 볼 수 있습니다):

ng g m admin --routing
로그인 후 복사

관리 모듈 내부에서 또 다른 관리 구성요소를 생성합니다:

ng g c admin
ng g c admin/email -m admin
ng g c admin/user -m admin
로그인 후 복사

사실 마지막 두 명령의 -m 매개변수는 admin/ 경로가 지정되었기 때문에 제거될 수 있으므로 기본적으로 admin에서 선언됩니다. 앱 모듈 대신에 모듈을 추가하세요.

그런 다음 app.module을 수정해야 합니다:

관리 모듈을 추가하세요.

그런 다음 admin.comComponent.html을 수정하고 router-outlet을 추가하세요:

수정하세요 admin-routing.module.ts:

실행: ngserv -o

주소를 직접 입력하세요: http://localhost:4200/admin

다음을 볼 수 있습니다:

그리고 URL을 입력하세요 : http://localhost:4200/admin/email

다음 내용이 표시됩니다:

그래서 문제 없습니다.

Gurad를 생성하세요.

ng g guard xxx
로그인 후 복사

여기에서 사례를 읽으신 후 방법을 마스터하신 것 같습니다. 기사. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

추천 자료:

Angular CLI가 Build

JS를 구현하여 마우스가 텍스트 위로 지나갈 때 플로팅 레이어 효과 팝업을 만드는 방법

위 내용은 Angular CLI가 경로를 생성하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨：
angular
원천：php.cn
이전 기사：Angular CLI가 라우팅을 작동하는 방법 다음 기사：webpack의 보다 실용적인 기능에 대한 자세한 소개
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
Angular 7은 SCSS에서 중복 속성을 제거합니다. AngularSASS(.scss)는 속성을 제거합니다. 브라우저 간 호환성을 위해 중복 속성을 포함할 수 있도록 이런 일이 발생하지 않도록 하려면 어떻게 해야 합...
에서 2024-04-04 23:28:54
0
1
1382
Angular 애플리케이션에서 Javascript 프로토타입 생성자를 가져올 때 오류가 발생합니다. 생성자가 있는 JS 파일을 가져오려고 하는 Angular 애플리케이션이 있습니다. 하지만 애플리케이션을 실행하면 webpack에서 오류가 발생합니다. 자산의 Ja...
에서 2024-04-04 11:36:15
0
1
288
Ajax를 사용하여 콘텐츠 생성 - ID로 스크롤하면 작동하지 않습니다. Ajax를 통해 얻은 데이터를 기반으로 페이지 콘텐츠를 생성합니다. 내가 겪고 있는 문제는 특정 ID로 스크롤하려고 할 때 스크롤이 발생하지 않거나 잘못된 위치로...
에서 2024-04-04 09:29:39
0
1
397
Angular에서 원형 SVG 온도 드래거를 만드시겠습니까? 다음은 제가 Angular에서 만들려고 하는 원형 썸 드래거의 정적 데모입니다. rinkle-dashoffset="-260" 설정을 사용하여 엄...
에서 2024-04-03 09:33:29
0
1
376
Angular: 텍스트 요소 색상을 이해하기 위한 속성 바인딩에 반응성이 부족합니다. 다음은 내 .ts 파일입니다. import{Component}from'@angular/core';@Component({selector:'app-event-bind...
에서 2024-04-01 17:28:52
0
1
358
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！