AngularJS와 NG 모델 지시어

NG 모델 명령의 HTML 값 컨트롤러 (입력 선택, 텍스트 영역)에 응용 프로그램 데이터를 결합하는 데 사용됩니다.

NG 모델 지시어

ng-model 지시어는 변수 값과 AngularJS와 도메인 생성 바인딩을 입력 할 수 있습니다.

예를 AngularJS와

<사업부의 NG-응용 프로그램 = "을 myApp "NG 컨트롤러 = "myCtrl">
이름 : <입력 NG 모델 = " 이름">
</ DIV>

<스크립트>
var에 응용 = angular.module ( '을 myApp', []);
app.controller ( 'myCtrl', 기능 ($ 범위) {
$ Scope.name = "홍길동";
});
</ 스크립트>

»시도

웨이 바인딩

입력 필드의 값을 수정하면 양방향 결합, 속성의 값은 AngularJS 및 검토 될 것이다 :

예를 AngularJS와

<사업부의 NG-응용 프로그램 = "을 myApp "NG 컨트롤러 = "myCtrl">
이름 : <입력 NG 모델 = " 이름">
<H1은> 다음을 입력 : {{이름}} </ H1>
</ DIV>

»시도

사용자 입력의 유효성을 검사합니다

예를 AngularJS와

<양식 NG-응용 프로그램 = "" 이름 = "myForm을">
이메일 :
<입력 유형 = "이메일"이름 = "myAddress"NG 모델 = "텍스트">
<스팬 NG 쇼 = "myForm.myAddress . $ Error.email"> 하지 유효한 이메일 주소 </ SPAN>
</ FORM>

»시도

위의 예는의 메시지 ng-show 속성은 반환 true 디스플레이 케이스.

응용 프로그램 상태

ng-model 지시자는 상태 값 (잘못된, 더러운, 감동, 오류 제공 ) 응용 프로그램 데이터를 :

예를 AngularJS와

<양식 NG-응용 프로그램 = "" 이름 = "myForm을"NG-초기화 = "으로 myText = '[email protected]'">
이메일 :
<입력 유형 = "이메일"이름 이 필요 = "myAddress"NG 모델 = "으로 myText"> </ P>
<H1> 상태 </ H1>
{{myForm.myAddress.}는 유효한 $}
{{myForm.myAddress.} 더러운 $}
{{myForm.myAddress. $}이 감동}
</ FORM>

»시도