Angular13 Angular - Validation(유효성검사) 기능 구현 안녕하세요. 로그인, 회원가입 등 모든 양식을 좀 더 안정적으로 받으려면 유효성 검사는 필수입니다. 준비 1.프로젝트 생성 ng g serve validation cd validation 새로운 프로젝트를 생성하고 생성된 프로젝트로 디렉토리를 변경합니다 2.컴퍼넌트 생성 ng g c simple-form --module=app.module ng g c complex-form --module=app.module ng g c formvalidation --module=app.module 3개의 Component 생성 총 3가지를 진행 할 예정입니다. 3.App.Module 설정 import { BrowserModule } from '@angular/platform-browser'; import { NgMod.. 2020. 5. 21. angular - interceptor 설정 API에 권한 인증 설정을 하게되면 header에 token 값을 넘겨줘야합니다. 번거롭게 API 요청을 할때마다 토큰 값을 header에 넣기 번거로우니 interceptor를 통해 자동으로 header에 토큰 값을 넣도록 하겠습니다. 1. 파일 생성 및 작성 token.interceptor.ts 파일을 만들어 줍니다. 제 파일 경로는 ClientApp/src/app/service/token.interceptor.ts 입니다 import { Injectable } from '@angular/core'; import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor, HttpResponse } from '@angular/common/http'; import.. 2020. 5. 20. Angular - Template 안녕하세요. 이번시간에는 Template에 대해 알아보도록 하겠습니다. Template - HTMl코드로서 템플릿을 작성 div, form태그 등을 사용하고, 스크립트는 사용하지 않음 - Template 표현식(Expression) : 자바스크립트와 비슷하게 변수 등을 뜻함 - Template 문장(Statement) : 이벤트 바인딩 할 때 사용 -바인딩 : 컴퍼넌트 즉 컴퍼넌트 속성과 데이터를 DOM((Document Object Model) 속성과 이벤트를 연결하는 것을 의미 바인딩 대상 : 속성,이벤트, ngModel, Class, stle 속성 바인딩 [] 은 todo컴퍼넌트의 todo 속성의 데이터를 바인딩 시킴 DOM에서 어떠한 이벤트가 일어나면 템플릿에 무언가를 하겠다라는 이벤트 바인딩 이.. 2020. 5. 10. Angular - Component 안녕하세요. 저번시간에 모듈에 대해 알아봤는데요. 지난 시간이 이어 Angular의 Component에 대해 알아보고 컨퍼넌트 안에서 또 다른 컨퍼넌트를 동작시키는 실습을 해보겠습니다. 전과 같은 프로젝트를 사용할 예정입니다. https://le-piee.tistory.com/29 Component Angular는 여러 컴퍼넌트로 구성되어 있음 - 뷰와 로직으로 구성 HTML 요소들의 그룹 -DOM과 같은 트리구조로 UI 요소들을 구성 W3C 표준 웹 컴포넌트 기술을 기반으로 함( https://developer.mozilla.org/ko/docs/Web/Web_Components) -하나의 레고블럭을 하나의 컴퍼넌트라고 보면 됨 - 레고블럭이 쌓여서 애플리케이션이 됨 위의 분홍색 박스들이 하나의 컴퍼넌.. 2020. 5. 10. 이전 1 2 3 4 다음
