Рекомендации по курсу:

AngularJS HTML DOM

AngularJS предоставляет инструкции для привязки данных приложения к свойствам элементов HTML DOM.

Применение инструкции: Инструкция ng-disabled

Примеры AngularJS

Инструкция привязывает данные AngularJS приложения к свойству disabled элементов HTML.
<p>
<div ng-app="" ng-init="mySwitch=true">
</p>
<p>
<button ng-disabled="mySwitch">Нажми меня!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Кнопка
</p>
</div>

Попробуйте сами

{{ mySwitch }}

Применение инструкции: ng-disabled mySwitch Инструкция привязывает данные приложения Привязка к HTML кнопке свойству.

ng-model Инструкция привязывает значение HTML флажка к mySwitch worth.

Если mySwitch worth trueЕсли так, кнопка будет отключена:

<p>
<button disabled>Нажми меня!</button>
</p>

Если mySwitch worth falseЕсли так, кнопка не будет отключена:

<p>
<button>Нажми меня!</button>
</p>

Инструкция ng-show

ng-show Инструкции для отображения или скрытия элементов HTML.

Примеры AngularJS

<div ng-app="">  
<p ng-show="true">Я видим.</p>  
<p ng-show="false">Я невидим.</p>  
</div>

Попробуйте сами

ng-show Инструкции основаны на ng-show:ЗначениеОтображение (или скрытие) элементов HTML.

Вы можете использовать любое выражение, которое оценивается как истина или ложь:

Примеры AngularJS

<div ng-app="" ng-init="hour=13">
<p ng-show="hour > 12">Я видим.</p>
</div>

Попробуйте сами

В следующей главе будут предоставлены дополнительные примеры того, как можно скрыть элементы HTML с помощью клика по кнопке.

Инструкция ng-hide

ng-hide Инструкции для скрытия или отображения элементов HTML.

Примеры AngularJS

<div ng-app="">  
<p ng-hide="true">Я невидим.</p>  
<p ng-hide="false">Я видим.</p>  
</div>

Попробуйте сами