앵귤러2 Angular 튜토리얼 2 Github 라우팅(Routing) 첫번째 Angular 앱을 끝낸 시점에 우리가 만든 온라인 쇼핑몰 애플리케이션에는 간단한 제품 목록만 존재합니다. 그래서 아직까지 앱의 상태를 관리하거나 네비게이션하는 기능은 없습니다. 앱이 동작하는 URL은 하나뿐이고, 이 URL에서는 언제나 제품의 목록과 간단한 설명을 표시하는 "My Page" 페이지만 표시됩니다. 이번 섹션에서는 제품에 대한 상세정보를 표시하는 화면을 만들어 봅시다. 이 페이지가 표시되는 URL도 새로 할당할 것입니다. 이렇게 구현하려면 Angular 라우터(router)를 사용하면 됩니다. 라우터를 사용하면 사용자가 접속한 주소에 어울리는 컴포넌트와 데이터를 사용자에게 보여줄 수 있습니다. 라우터는 다음과 같은 경우에 동작합니다 주소표시줄에 U.. 2020. 2. 19. Angular 튜토리얼 1 Github Angular 그냥 시작해보기1 따로 프로젝트를 생성할 필요없에 웹에서 시작해보기 (StackBlitz에 새로운 프로젝트를 생성하려면 여기를 클릭하세요.) StackBlitz에서 생성된 프로젝트 첫 화면 템플릿 문법 Angular 템플릿 문법을 사용하면 HTML과 JavaScript을 확장할 수 있습니다. 이번 섹션에서는 "Products" 영역을 어떻게 확장할 수 있는지 알아봅시다. (템플릿 문법에만 집중하기 위해 아래 예제에서는 product-list.component.ts 파일에 미리 정의된 제품 데이터와 메소드를 사용합니다.) 1. product-list 폴더에 있는 product-list.component.html 템플릿 파일을 엽니다. 2. 제품의 이름을 표시할 수 있도록 템플릿을.. 2020. 2. 18. 이전 1 다음
