evento AngularJS
evento AngularJS HTML ha la propria istruzione.
ng-click di comando
direttiva ng-clic definisce AngularJS evento Click.
AngularJS esempi
<Pulsante ng clic = "count = count + 1"> me punto! </ Button>
<P> {{count}} </ p>
</ Div>
Prova »
Nascondere elementi HTML
ng-nascondere direttiva fissa parte dell'applicazione è visibile.
ng-nascondere = Impostazione elementi "veri" HTML non sono visibili.
ng-nascondere = "false" Impostazione elemento HTML è visibile.
AngularJS esempi
<Pulsante ng-clic = "Toggle ()" >> Mostra / Nascondi </ button>
<P ng-nascondere = "myVar ">
Nome: <input type = "text" modello ng = "firstName"> <br>
Nome: <input type = "text" modello ng = "Cognome"> <br>
<Br>
Nome completo: {{firstName + " " + lastName}}
</ P>
</ Div>
<Script>
var app = angular.module ( 'myApp', []);
app.controller ( 'personCtrl', function ($ portata) {
$ Scope.firstName = "John",
$ Scope.lastName = "Doe"
$ Scope.myVar = false;
$ Scope.toggle = function () {
! $ Scope.myVar = $ scope.myVar;
};
});
</ Script>
Prova »
Analisi di applicazione:
La prima sezione di controllo parte personController simile.
L'applicazione ha un attributo di default: $ scope.myVar = false;
ng-nascondere set di istruzioni <p> e due campi di immissione sono visibili, a seconda del valore di myVar (vero o falso) set è visibile.
levetta funzioni () viene utilizzato per commutare il valore della variabile myVar (vero e falso).
ng-nascondere = "true", in modo tale elemento non è visibile.
Elementi di visualizzazione HTML
istruzioni ng-spettacolo può essere utilizzato per impostare se la parte di applicazione del visibile.
ng-show = è possibile impostare elementi HTML "false" non sono visibili.
ng-show = "true" può impostare l'elemento HTML è visibile.
L'esempio seguente utilizza il comando ng-show:
AngularJS esempi
<Pulsante ng-clic = "Toggle ()"> Mostra / Nascondi </ button>
<P ng-show = "myVar ">
Nome: <input type = "text" modello ng = "firstName"> <br>
Cognome: <input type = "text" modello ng = "Cognome"> <br>
<Br>
Nome: {{firstName + "" + lastName}}
</ P>
</ Div>
<Script>
var app = angular.module ( 'myApp', []);
app.controller ( 'personCtrl', function ($ portata) {
$ Scope.firstName = "John",
$ Scope.lastName = "Doe"
$ Scope.myVar = true;
$ Scope.toggle = function () {
! $ Scope.myVar = $ scope.myVar;
}
});
</ Script>
Prova »