Angularjs to framework JavaScript. Może być dodany do strony HTML z tagu <script>.
Angularjs rozszerza atrybuty HTML z dyrektywami i wiąże dane HTML z wyrażeniami.
Angularjs jest ramowa JavaScript
Angularjs to framework JavaScript. Jest to biblioteka napisana w języku JavaScript.
Angularjs jest rozprowadzany jako plik JavaScript, które można dodać do strony internetowej z tagu skryptu:
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>Angularjs Rozszerza HTML
Angularjs rozciąga HTML z NG-dyrektyw.
Dyrektywa ng-app definiuje angularjs aplikację.
Dyrektywa ng model wiąże wartość kontroli HTML (input, select, textarea) do danych aplikacji.
Dyrektywa ng-wiążą wiąże danych aplikacji do widoku HTML.
angularjs Przykład
<!DOCTYPE html>
<html>
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="">
<p>Name: <input type="text" ng-model="name"></p>
<p ng-bind="name"></p>
</div>
</body>
</html>
Spróbuj sam " Przykład wyjaśnił:
Angularjs uruchamia się automatycznie, gdy strona została załadowana.
Dyrektywa ng-app mówi angularjs że element <div> jest "właścicielem" na angularjs aplikacji.
Dyrektywa ng model wiąże wartość pola wprowadzania danych do nazwy zmiennej aplikacji.
Dyrektywa ng-wiążą wiąże innerHTML elementu <p> Aby nazwy zmiennej aplikacji.
angularjs dyrektywy
Jak już widzieliśmy, angularjs dyrektyw atrybutów HTML z prefiksem ng.
Dyrektywa ng-init inicjuje angularjs zmiennych aplikacji.
angularjs Przykład
<div ng-app="" ng-init="firstName='John'">
<p>The name is <span ng-bind="firstName"></span></p>
</div>
Spróbuj sam " Ewentualnie z ważną HTML:
angularjs Przykład
<div data-ng-app="" data-ng-init="firstName='John'">
<p>The name is <span data-ng-bind="firstName"></span></p>
</div>
Spróbuj sam "  | Można użyć danych ng-zamiast ng-jeśli chcesz, aby Twoja strona HTML ważny. |
|---|
Dowiesz się o wiele więcej na temat dyrektyw w dalszej części tego podręcznika.
angularjs Expressions
Angularjs wyrażenia pisemnej wewnątrz podwójnych szelek: {{wyrażenie}}.
Angularjs będzie "wyjście" Dane dokładnie tam, gdzie wyrażenie jest napisane:
angularjs Przykład
<!DOCTYPE html>
<html>
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="">
<p>My first expression: {{ 5 + 5 }}</p>
</div>
</body>
</html>
Spróbuj sam " Angularjs wyrażenia wiązania danych angularjs HTML w taki sam sposób jak dyrektywa ng-bind.
angularjs Przykład
<!DOCTYPE html>
<html>
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="">
<p>Name:
<input type="text" ng-model="name"></p>
<p>{{name}}</p>
</div>
</body>
</html>
Spróbuj sam " Dowiesz się więcej na temat wyrażeń w dalszej części tego podręcznika.
angularjs Applications
Angularjs moduły definiują aplikacje angularjs.
Angularjs kontrolery sterowania aplikacjami angularjs.
Dyrektywa ng-app definiuje aplikacja, dyrektywa ng kontroler definiuje kontroler.
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 " Angularjs moduły definiują aplikacje:
angularjs Moduł
var app = angular.module('myApp', []);
Angularjs aplikacji sterujących kontrolery:
angularjs Controller
app.controller('myCtrl',
function($scope) {
$scope.firstName= "John";
$scope.lastName= "Doe";
});
Dowiesz się więcej o modułach i kontrolerów w dalszej części tego podręcznika.