AngularJS HTML ГЛАВНАЯ
В AngularJS есть директивы для привязки данных приложения к атрибутам элементов HTML DOM.
Директива ng-disabled
Директива ng-disabled привязывает данные приложения AngularJS к атрибуту disabled элементов HTML.
Пример AngularJS
<div ng-app="" ng-init="mySwitch=true">
<p>
<button ng-disabled="mySwitch">Click Me!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Button
</p>
<p>
{{ mySwitch }}
</p>
</div>
Описание приложения:
Директива ng-disabled привязывает данные приложения mySwitch к атрибуту disabled кнопки HTML .
Директива ng-model связывает значение HTML-элемента флажка со значением mySwitch .
Если значение mySwitch оценивается как true , кнопка будет отключена:
<p>
<button disabled>Click Me!</button>
</p>
Если значение mySwitch оценивается как false , кнопка не будет отключена:
<p>
<button>Click Me!</button>
</p>
Директива ng-show
Директива ng-show показывает или скрывает элемент HTML.
Пример AngularJS
<div ng-app="">
<p ng-show="true">I am visible.</p>
<p ng-show="false">I am not visible.</p>
</div>
Директива ng-show показывает (или скрывает) элемент HTML в зависимости от значения ng-show.
Вы можете использовать любое выражение, которое оценивается как истинное или ложное:
Пример AngularJS
<div ng-app="" ng-init="hour=13">
<p ng-show="hour > 12">I am visible.</p>
</div>
В следующей главе есть еще примеры использования щелчка кнопки для скрытия HTML-элементов.
Директива ng-hide
Директива ng-hide скрывает или показывает элемент HTML.
Пример AngularJS
<div ng-app="">
<p ng-hide="true">I am
not visible.</p>
<p ng-hide="false">I am visible.</p>
</div>