분류 전체보기137 앵귤러 기초(Angular basic) 31. 기능 모듈, 모듈 분리 지금까지 우리는 루트 애플리케이션 모듈인 AppModule을 사용했습니다. 하나의 모듈에 모든 부품과 파이프를 선언 하였습니다. 이번 포스트에서는 모듈을 분리해 책임과 구분을 나눠보겠습니다 이번 포스트는 아래 내용을 다루고 있습니다. 모듈 분리하기 모듈 정의하기 기능 모듈 작성하기 모듈 분리하기 현재 루트 모듈인 AppModule에서는 WelcomComponent와 같은 기본 애플리케이션 기능과 StarComponent과 같은 공유기능을 함께 관리 하고 있습니다. 우선 기본 애플리케이션 기능은 AppComponent, WelcomeComponent로 생각해 볼 수 있습니다. 영화 관련된 기능은 MovieListComponent, MovieDetailComponet로 볼 수 있겠네요. 그 외로 StarSc.. 2022. 2. 10. 앵귤러 기초(Angular basic) 30. 앵귤러 모듈(Angular Module) 앵귤러에서 가장 중요한 개념 중 하나인 모듈에 대해 알아보도록 하겠습니다. 이번 포스트는 아래 내용을 다루고 있습니다. 앵귤러 모듈의 역할 애플리케이션의 구성 앵귤러 모듈이란 앵귤러 모듈은 NgModule 데코레이터가 있는 클래스입니다. 지난 포스트에서 계속 다뤘던 AppModule은 아래와 같습니다. 앵귤러 모듈의 역할 애플리케이션의 일부를 구성하고 이를 응집력 있는 기능 블록 정리해 주고 외부 라이브러리 기능 통해 애플리케이션을 확장하게 합니다. 앵귤러 모듈은 컴포넌트 템플릿에서 디렉티브와 파이프를 위한 실행 환경을 제공합니다. 다른 모듈로부터 클래스를 선택적으로 취합하여 통합 모듈로 다시 내보낼 수 있게 합니다. 애플리케이션이 시작될 때 빠르게 로드되거나 라우터에 의해 비동기적으로 느리게 로드(la.. 2022. 2. 10. 앵귤러 기초(Angular basic) 29. 라우트 가드(route guard) 관리자 같은 특정 사용자만 특정 url에 접근해야 하는 경우가 있을 수 있습니다. 경로에 대해 접근을 제한하려고 할때 앵귤러에서는 어떻게 해야할까요? 혹은 입력 페이지를 작성한 후 다른 페이지로 이동할때 저장 여부는 어떻게 확인해야 할까요? 앵귤러의 라우팅 가드에 대해 알아 보겠습니다. 이번 포스트는 아래 내용을 다루고 있습니다. 라우트 가드 종류 CanActivate 가드 만들기 라우트 가드 종류 앵귤러 라우터는 경로 탐색을 보호하기 위한 CanActivate, 현재 경로에서 벗어나는걸 보호하기 위한 CanDeactivate, 경로를 활성화하기 전에 데이터를 프리패치 하기위한 Resolve, 비동기 라우팅 방지하기 위한 CanLoad등 여러가지 보호 기능을 제공하고 있습니다. 이번 포스트에서는 CanA.. 2022. 2. 8. 앵귤러 기초(Angular basic) 28. 코드에서 라우팅 하기 이전 포스트에서는 routerLink로 코드 경로 이동을 해왔습니다. 템플릿 이외의 컴포넌트의 코드에서는 어떤 식으로 라우팅을 해야 할까요? 이번 포스트는 아래 내용을 다루고 있습니다. 코드에서 라우팅이 필요한 케이스 Router서비스, navigate메소드 사용하기 영화 상세페이지가 아래와 같이 있습니다. 상세페이지에서 영화 목록 페이지로 다시 이동하는 버튼을 추가 하려고 합니다. 이전에 했던 것처럼 템플릿에서 routerLink의 디렉티브를 사용해서 경로를 이동 할수 있습니다. 하지만 컴포넌트 안에서의 코드로 라우팅 하는 것도 가능합니다. 코드에서 라우팅이 필요한 케이스 어떠한 경우 템플릿의 routerLink대신 코드를 사용해서 라우팅 해야 할까요? 예를 들어 저장 버튼을 생각해 보세요. 유저가 저.. 2022. 2. 7. 이전 1 ··· 24 25 26 27 28 29 30 ··· 35 다음