Angularjs kontrolerzy kontrolują dane aplikacji angularjs.
Angularjs kontrolery są regularne obiektów JavaScript.
angularjs Kontrolery
Angularjs aplikacje są kontrolowane przez kontrolerów.
Dyrektywa definiuje ng kontroler kontroler aplikacji.
Kontroler jest obiektem JavaScript, utworzony za pomocą standardowego obiektu konstruktora JavaScript.
angularjs Przykład
<div ng-app="myApp" ng-controller="myCtrl">
First Name: <input type="text" ng-model="firstName"><br>
Last Name: <input type="text" ng-model="lastName"><br>
<br>
Full Name: {{firstName + " " + lastName}}
</div>
<script>
var app = angular.module('myApp',
[]);
app.controller('myCtrl', function($scope) {
$scope.firstName
= "John";
$scope.lastName = "Doe";
});
</script>
Spróbuj sam " Zastosowanie wyjaśnił:
Stosowanie angularjs jest określona ng app = "myApp". Aplikacja działa wewnątrz <div>.
NG-controller = atrybut "myCtrl" jest angularjs dyrektywa. Definiuje regulatora.
Funkcja myCtrl jest funkcją JavaScript.
Angularjs wywoła kontroler z obiektu $ zakres.
W angularjs, $ zakres jest przedmiotem wniosku (właściciel zmiennych aplikacji i funkcji).
Regulator tworzy dwie właściwości (zmiennych) w zakresie (imię i nazwisko).
NG-modelowe Dyrektywy wiążą pól wejściowych do właściwości kontrolerów (imię i nazwisko).
Metody Controller
Powyższy przykład wykazać obiekt kontrolera z dwóch właściwości: Nazwisko i Imię.
Kontroler może mieć również metody (zmienne jak funkcje):
angularjs Przykład
<div ng-app="myApp" ng-controller="personCtrl">
First Name: <input type="text" ng-model="firstName"><br>
Last Name: <input type="text" ng-model="lastName"><br>
<br>
Full Name: {{fullName()}}
</div>
<script>
var app = angular.module('myApp', []);
app.controller('personCtrl',
function($scope) {
$scope.firstName = "John";
$scope.lastName
= "Doe";
$scope.fullName = function() {
return $scope.firstName + " " + $scope.lastName;
};
});
</script>
Spróbuj sam " Kontrolerów w plikach zewnętrznych
W większych aplikacji, to jest wspólne dla kontrolerów sklepowych w plikach zewnętrznych.
Wystarczy skopiować kod między znacznikami <SCRIPT> do zewnętrznego pliku o nazwie personController.js :
angularjs Przykład
<div ng-app="myApp" ng-controller="personCtrl">
First Name: <input type="text" ng-model="firstName"><br>
Last Name: <input type="text" ng-model="lastName"><br>
<br>
Full Name: {{firstName + " " + lastName}}
</div>
<script src="personController.js"></script>
Spróbuj sam " Inny przykład
Na następnym przykładzie będziemy tworzyć nowy plik kontrolera:
angular.module('myApp', []).controller('namesCtrl',
function($scope) {
$scope.names = [
{name:'Jani',country:'Norway'},
{name:'Hege',country:'Sweden'},
{name:'Kai',country:'Denmark'}
];
});
Zapisz plik jako namesController.js :
A następnie użyć pliku kontrolera w aplikacji:
angularjs Przykład
<div ng-app="myApp" ng-controller="namesCtrl">
<ul>
<li ng-repeat="x in names">
{{ x.name + ', ' + x.country }}
</li>
</ul>
</div>
<script src="namesController.js"></script>
Spróbuj sam "