본문 바로가기

구조지시문2

앵귤러 기초(Angular basic) 8.ngFor 구조지시문 ngFor에 대해 알아보겠습니다. 이번 포스트에서는 아래 내용을 다루고 있습니다. ngFor 사용법 for in 과 for of 차이점 ngFor 사용법 ngFor를 사용하면 반복 가능한 목록의 각 항목에 대해 DOM 트리를 각각 반복 처리 할 수 있습니다. 일단 하나의 항목을 표시하는 html을 정의하고 Angular에게 해당 블록을 반복해 표시하도록 ngFor를 사용해야 합니다. 예를 들어, 영화 데이터의 배열을 출력하고 싶다고 가정해 보겠습니다. 해야 할 일은 먼저 하나의 테이블 행과 하위 테이블 데이터 요소를 정의하는 것입입니다. 그런 다음 *ngFor를 이용하여 해당 테이블 행 요소와 하위 항목이 영화목록(movies)을 각각 영화 데이터 대해 반복시킵니다. 여기서 let 키워드를 .. 2022. 1. 18.
앵귤러 기초(Angular basic) 7.Structural Directive, ngIf 구조지시문(structural Directive)에 대해 알아보고, 구조지시문인 ngIf를 사용해 보겠습니다 이번 포스트에서는 아래의 내용을 다루고 있습니다. Directive종류 구조 지시문(Structural Directive) ngIf란 Directive Directive는 html을 강화하고 확장하는데 사용하는 custom html 요소(element) 혹은 속성(attribute)라고 생각할 수 있습니다. 우리는 directive를 만들어서 사용하거나, angular가 제공 해주는 내장 지시문을 사용할 수 있습니다. 두 종류의 Directive custom directive(커스텀 지시문) Built-In directive(내장 지시문) 이전 포스트에서는 아래와 같이 component를 만들고 .. 2022. 1. 17.