Polecane kursy:

HTML DOM AngularJS

AngularJS oferuje instrukcje, które przypisują dane aplikacji do atrybutów elementów HTML DOM.

Aplikacja instrukcji: Instrukcja ng-disabled

Przykład AngularJS

Instrukcja przypisuje dane aplikacji AngularJS do atrybutu disabled elementu HTML.
<p>
<div ng-app="" ng-init="mySwitch=true">
</p>
<p>
<button ng-disabled="mySwitch">Click me!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Button
</p>
</div>

Spróbuj sam

{{ mySwitch }}

Aplikacja instrukcji: ng-disabled mySwitch Instrukcja przypisuje dane aplikacji do HTML przycisku za pomocą Zablokuj atrybutu.

ng-model Instrukcja przypisuje wartość elementowi HTML checkbox do mySwitch wartości.

Jeśli mySwitch wartości trueprzycisk zostanie zablokowany:

<p>
<button disabled>Click me!</button>
</p>

Jeśli mySwitch wartości falseW przypadku braku, przycisk nie zostanie zablokowany:

<p>
<button>Click me!</button>
</p>

Instrukcja ng-show

ng-show Instrukcja wyświetlania lub ukrywania elementów HTML.

Przykład AngularJS

<div ng-app="">  
<p ng-show="true">Jest widoczny.</p>  
<p ng-show="false">Nie jest widoczny.</p>  
</div>

Spróbuj sam

ng-show Instrukcja jest zależna od wartościWartośćWyświetl (lub ukryj) elementy HTML.

Możesz użyć dowolnego wyrażenia ocenianego jako prawdziwe lub fałszywe:

Przykład AngularJS

<div ng-app="" ng-init="hour=13">
<p ng-show="hour > 12">Jest widoczny.</p>
</div>

Spróbuj sam

W następnym rozdziale zostaną przedstawione więcej przykładów, które wyjaśnią, jak ukrywać elementy HTML za pomocą kliknięcia przycisku.

Instrukcja ng-hide

ng-hide Instrukcje ukrywania lub wyświetlania elementów HTML.

Przykład AngularJS

<div ng-app="">  
<p ng-hide="true">Nie jest widoczny.</p>  
<p ng-hide="false">Jest widoczny.</p>  
</div>

Spróbuj sam