AngularJS 17

AngularJS #20 - API

✔ AngularJS API > API는 Application Programming Interface의 약자다 1. AngularJS Global API > AngularJS Global API는 global JavaScript 함수의 집합이다. > Comparing objects, Iterating objects, Converting data와 같은 일을 한다 > Global API 함수들은 angular object를 통해 접근이 가능하다 2. Examples {{ x1 }} {{ x2 }} {{ x1 }} {{ x2 }} {{ x1 }} {{ x2 }} {{ x1 }} {{ x2 }} ** 위 글은 w3schools.com에 있는 내용을 한국어로 번역하여 적어둔 글입니다. - https://www...

IT 2022.01.11

AngularJS #19 - Form Validation

✔ AngularJS Form Validation > AngularJS는 입력값을 검증할수 있습니다 1. Form Validation > AngularJS는 클라이언트 측에서 유효성 검증을 한다 > AngularJS는 form과 input fields의 상태를 모니터링하고, 유저의 현재 상태가 어떤지 알려준다 > AngularJS는 유저가 선택했는지 수정했는지에 대한 정보를 가지고 있다 > 표준 HTML5 속성을 input값을 검증하기 위해 써도 되고, 직접 함수를 만들어서 검증을 해도 된다 > 클라이언트 측에서만 검증을 하는 것은 보안이 안되어있기 때문에 서버측에서도 유효성 검증이 필요하다 The input's valid state is: {{myForm.myInput.$valid}} 2. E-mail..

IT 2022.01.11

AngularJS #18 - Forms

✔ AngularJS Forms > AngularJS에 있는 Form에서는 data-binding과 입력값(input, select, button, textarea)에 대한 validation을 제공한다 1. Data-Binding > ng-model directive를 사용하여 data-binding을 한다 : 이제 application에는 firstname이라는 이름을 가진 속성이 존재하게 된다 : ng-model directive는 input controller를 application 전체에 묶어준다 : firstname은 다른데서도 사용이 가능하다 First Name: You entered: {{firstname}} 2. Checkbox Check to show a header: My Header..

IT 2022.01.08

AngularJS #17 - Events

✔ AngularJS Events > AngularJS만의 HTML events directives가 있다 1. AngularJS Events > ng-blur > ng-change > ng-click > ng-copy > ng-cut > ng-dblclick > ng-focus > ng-keydown > ng-keypress > ng-keyup > ng-mousedown > ng-mouseenter > ng-mouseleave > ng-mousemove > ng-mouseover > ng-mouseup > ng-paste : angularJS의 이벤트 directive를 통해서 우리는 특정 사용자 이벤트를 잡아낼 수 있는데, 이때 angularJS의 event directive와 HTML의 event가..

IT 2022.01.03

AngularJS #16 - HTML DOM

✔ AngularJS HTML DOM > AngularJS는 directive를 통해 어플리케이션의 데이터를 HTML DOM 요소와 묶는다 1. The ng-disabled Directive > ng-disabled directive는 AngularJS 어플리케이션 데이터를 HTML의 disabled와 묶는다 Click Me! Button {{ mySwitch }} : 설명하자면 체크박스의 값을 ng-model에서 받아서 해당 값을 통해서 button의 ng-disabled 값이 변하여 버튼이 활성화 및 비활성화 되고, 그 값이 {{ }}를 통해서 text로 나타나게 된다 2. The ng-show Directive > ng-show directive를 통해서 HTML 요소를 보이거나 숨기게 할 수 있음..

IT 2022.01.02

AngularJS #15 - SQL

✔ AngularJS SQL > AngularJS는 DB에 있는 데이터를 표현하는데 아주 적합하다. 근데 그 데이터가 JSON 형식이어야한다 1. Fetching Data From a PHP Server Running MySQL {{ x.Name }} {{ x.Country }} 2. Fetching Data From an ASP.NET Server Running SQL {{ x.Name }} {{ x.Country }} ** 위 글은 w3schools.com에 있는 내용을 한국어로 번역하여 적어둔 글입니다. - https://www.w3schools.com/angular/angular_sql.asp Angular SQL W3Schools offers free online tutorials, refere..

IT 2022.01.02

AngularJS #14 - Select Boxes

✔ AngularJS Select Boxes > array or object를 가지고 dropdown list를 만들 수 있게 해준다 1. Creating a Select Box Using ng-options > dropdown list를 만들때 ng-options directive를 이용해야한다 2. ng-options vs ng-repeat > ng-repeat을 이용해서 똑같은 것을 만들 수 있다 {{x}} : ng-repeat directive는 HTML 코드 덩어리를 반복해서 dropdown list를 만들 수 있다. 그러나 ng-options directive는 dropdown list를 만들기 위해 특별히 만들어졌다 3. 어떤걸 이용해야하는가 > ng-repeat, ng-options 둘다 ..

IT 2022.01.01