본문 바로가기

개인공부/Angular3

Directive의 설명과 타입, Built-in attribute directive 중 NgClass 활용법 Directive? Angular 어플리케이션 안에 있는 엘리먼트에 어떤 동작을 추가하는 클래스 Angular는 폼, 목록, 스타일 등에 적용할 수 있는 기본 디렉티브를 다양하게 제공한다. Angular Directive Type은 3가지로 구분할 수 있다. 컴포넌트(Component) - 템플릿이 존재하는 디렉티브이다. 가장 많이 사용되는 Type 어트리뷰트 디렉티브(Attribute directives) - 엘리먼트, 컴포넌트, 디렉티브의 모습이나 동작을 변경하는 Type 구조 디렉티브(Structural directives) - 조건에 따라 DOM 엘리먼트를 추가하거나 제거하는 Type Built-in attribute directives ( 기본 어트리뷰트 디렉티브 ) HTML 엘리먼트, 어트리뷰.. 2022. 3. 9.
Angular Component Component - Angular 애플리케이션 구성 기본 단위 화면을 렌더링하는 HTML Template 동작 정의 TypeScript Class Component를 Template에 추가할 때 사용하는 CSS Selector Component가 표시되는 모습을 정의하는 CSS 스타일 4가지로 구성된다. Angular CLI로 컴포넌트 생성 방법 ng generate component 명령 실행시 컴포넌트 구성 컴포넌트 이름으로 폴더가 생성 .component.ts 컴포넌트 파일 생성 .component.html 템플릿 파일 생성 .component.css CSS 스타일 파일 생성 .component.spec.ts 테스트 파일 생성 이렇게 만든 컴포넌트의 셀렉터는 이다. Component LifeCyc.. 2022. 3. 9.
Angular란? Angular란? TypeScript를 기반으로 개발된 개발 플랫폼 확장가능한 컴포넌트 구조로 웹 애플리케이션을 만드는 프레임워크 라우팅, 폼 관리, 클라이언트-서버 통신 등 웹 개발에 필요한 라이브러리를 통합한 모음집 애플리케이션 개발, 빌드, 테스트, 수정에 필요한 개발자 도구를 제공한다 라고 Angular 공식 문서에 적혀있다. Angular 기초 컴포넌트(Component) - 애플리케이션을 구성하는 기본 단위 @Component 데코레이터(Decorator)가 붙는 TypeScript Class, HTML Template, Style로 구성된다. Decorator? Java에서의 Annotation과 유사하게 메타데이터를 지정할 수 있다. 다른 점은 메소드나 프로퍼티를 직접 변경할 수 있다는 점.. 2022. 3. 6.