AngularJS 빠른 시작 설명서 19: 예제 코드

<!--
a.tryitbtn, a.tryitbtn:link, a.tryitbtn:visited {
display: inline-block;
color: #FFFFFF;
background-color: #D84D2D;
font-weight: bold;
text-align: center;
padding: 0.3% 2.0%;
text-decoration: none;
border: 1px solid #D84D2D;
border-radius: 5px;
white-space: nowrap;
cursor: defauilt;
}
a.tryitbtn:hover{
color: #D84D2D;
background-color: #FFFFFF;
cursor: pointer;
}
hr.angular{
margin: 20px 0px 20px 0px; border: 0; border-top: 1px solid #ddd;
}
table.lamp {
width: 100%;
padding: 0px;
border: 1px solid #ddd;
}
table.lamp th {
color: #000000;
background-color: white;
border: none !important;
padding: 10px 5px 10px 10px !important;
}
table.lamp td {
padding: 4px 10px 4px 0px !important;
border: none !important;
background-color: #ffffff;
}
div.chapter {
margin: 10px 0px 10px 0px;
padding: 0px;
width: auto;
overflow: hidden;
}
div.chapter div.prev {
width: 50%;
float: left;
text-align: left;
overflow: hidden;
white-space: nowrap;
}
div.chapter div.next {
width: 50%;
float: right;
text-align: right;
white-space: nowrap;
overflow: hidden;
}
-->
본고에서 제시한 대부분의 예는 직접 실행할 수 있으며 실행 단추를 누르면 결과를 볼 수 있으며 온라인 편집 코드도 지원한다.

<div ng-app="">

<p>Name: <input type="text" ng-model="name"></p>
<p>You wrote: {{ name }}</p> 

</div>

실행

AngularJS 베이스

나의 첫 번째 AngularJS 명령어
나의 첫 번째 AngularJS 명령어 (데이터 - 접두사 포함)
나의 첫 번째 AngularJS 표현식
나의 첫 번째 AngularJS 컨트롤러
AngularJS 기본 소개

AngularJS 표현식

간단한 표현식 예
ng-app 표현식 없음
숫자식
숫자 표현식 대신 ng-bind 명령 사용하기
문자열이 있는 표현식
문자열 표현식 대신 ng-bind 명령 사용하기
Objects 객체가 있는 표현식
Objects 객체 표현식 대신 ng-bind 명령을 사용합니다.
배열이 있는 표현식
그룹 표현식 대신 ng-bind 명령 사용하기
AngularJS 표현식 개요

AngularJS 명령

AngularJS 명령
ng-model 명령
ng-repeat 명령어 (그룹)
ng-repeat 명령어(Objects 객체)
AngularJS 명령 개요

AngularJS 컨트롤러

AngularJS 컨트롤러
컨트롤러 속성
컨트롤러 방법
JavaScript 파일 I의 컨트롤러
JavaScript 파일 II의 컨트롤러
AngularJS 컨트롤러 개요

AngularJS 필터

표현식 필터 uppercase
표현식 필터 lowercase
표현식 필터currency
명령 필터orderby
입력 내용 필터링
AngularJS 필터 개요

AngularJS XMLHttpRequest

정적 JSON 파일 읽기
AngularJS Http 객체 개요

AngularJS 테이블

간단한 표 보이기
CSS 스타일의 테이블 표시
orderBy 필터가 있는 표 보이기
uppercase 필터가 있는 표 보이기
index 줄 번호가 있는 표를 표시합니다
이벤트와odd 양식이 있는 표를 표시합니다
AngularJS 테이블 개요

AngularJS - SQL에서 데이터 읽기

MySQL 데이터베이스에서 데이터 읽기
SQL Server 데이터베이스에서 데이터 읽기
AngularJS SQL 개요

AngularJS DOM 노드

ng-disabled 명령
ng-show 명령
ng-hide 명령
AngularJS DOM 노드 개요

AngularJS 이벤트

ng-click 명령
ng-hide 명령
ng-show 명령
AngularJS 이벤트 개요

AngularJS 모듈

body의 AngularJS 모듈
파일의 AngularJS 모듈
AngularJS 모듈 개요

AngularJS 양식

AngularJS 양식
AngularJS 데이터 검증
AngularJS 양식 개요

AngularJS API

angular.lowercase()
angular.uppercase()
angular.isString()
angular.isNumber()
AngularJS API 개요

AngularJS Bootstrap

Bootstrap을 사용한 AngularJS
Bootstrap 및 Includes를 사용한 AngularJS
AngularJS Bootstrap 개요

AngularJS Application

AngularJS Note Application
AngularJS TODO Application
AngularJS Application 개요
이전 - AngularJS 빠른 시작 설명서 18: Application
다음 장 - AngularJS 빠른 시작 설명서 20: 빠른 참조