Latest web development tutorials

AngularJS와 HTML DOM

AngularJS와 응용 프로그램 데이터 속성의 HTML의 DOM 요소를 결합하기위한 지침을 제공합니다.


NG 장애인 명령

HTML 장애인 재산 NG 장애인 명령을 직접 바인딩 응용 프로그램 데이터.

예를 AngularJS와

<사업부의 NG-응용 프로그램 = "" NG-초기화 = "mySwitch = 진정한">

<P>
<버튼 NG 장애인 = "mySwitch "> 나 포인트! </ 버튼>
</ P>

<P>
<입력 유형 = "체크 박스"NG -Model = "mySwitch"> 버튼을
</ P>

<P>
{{MySwitch}}
</ P>

</ DIV>

»시도

예를 설명하기 :

NG 장애인 HTML 장애인 재산에 명령 바인딩 응용 프로그램 데이터 "mySwitch".

HTML 입력 체크 박스 요소 내용 (값)에 NG 모델 지시어 바인드 "mySwitch".

mySwitch true의 경우, 단추를 사용할 수 없습니다 :

<P>
나 포인트 <버튼이 비활성화>! </ 버튼>
</ P>

mySwitch가 false의 경우, 당신은 버튼을 사용할 수 있습니다 :

<P>
<버튼> 나 포인트! </ 버튼>
</ P>

NG 쇼 지침

NG 쇼 지침을 숨기거나 HTML 요소를 표시합니다.

예를 AngularJS와

<사업부의 NG-응용 프로그램 = "" >

<P NG 쇼 = "진정한 "> 내가 볼입니다. </ P>

<P NG 쇼 = "거짓 "> 나는 눈에 보이지 않는이었다. </ P>

</ DIV>

»시도

값을 기준으로 NG-show 명령 (숨기기) HTML 요소를 표시합니다.

당신은 부울 값 (true 또는 false)을 계산하는 식을 사용할 수 있습니다 :

예를 AngularJS와

<사업부 NG-응용 프로그램 = "" NG-초기화 = "시간 = 13 "> <P NG 쇼 = "시간> 12 "은> 나는 볼입니다. </ P> </ DIV>

»시도

주의 다음 장에서, 우리는 모든 버튼을 HTML 요소의 더 인스턴스를 클릭하여 숨겨집니다.

NG 숨기기 명령

NG 숨기기 명령을 숨기거나 표시 HTML 요소입니다.

예를 AngularJS와

< div ng-app= "" >

< p ng-hide= "true" >我是不可见的。 < /p >

< p ng-hide= "false" >我是可见的。 < /p >

< /div >

»시도