Angularjs bir JavaScript çerçevesidir. Bu bir ile bir HTML sayfasına eklenebilir <script> etiketi.
Angularjs HTML Direktiflerine niteliklerini uzanır ve İfadelerle HTML verileri bağlar.
Angularjs bir JavaScript Çerçeve olduğu
Angularjs bir JavaScript çerçevesidir. Bu JavaScript ile yazılmış bir kütüphanedir.
Angularjs bir JavaScript dosyası olarak dağıtılır ve bir komut dosyası etiketi olan bir web sayfasına eklenebilir:
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
Angularjs HTML Uzattı
Angularjs ng-direktifleri HTML uzanır.
Ng uygulama yönergesi angularjs uygulama tanımlamaktadır.
Ng model yönergesi HTML kontroller değerinin bağlanan (input, select, textarea) uygulama verilerine.
Ng bağlama yönergesi HTML görünümüne uygulama verilerini bağlanır.
angularjs Örnek
<!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>
Kendin dene " Örnek açıklanmıştır:
Web sayfası yüklendiğinde angularjs otomatik olarak başlar.
Ng-app yönergesi angularjs söyler <div> unsurdur "owner" bir angularjs uygulamanın.
Ng model yönergesi bir uygulama ise değişken adının giriş alanı değerini bağlanır.
Ng bağlama yönergesi innerHTML bağlanan <p> bir uygulama ise değişken adının elemanı.
angularjs Direktifleri
Zaten gördüğümüz gibi, angularjs direktifler HTML bir ng öneki ile özellikleridir.
Ng init yönergesi angularjs uygulama değişkenleri başlatır.
angularjs Örnek
<div ng-app="" ng-init="firstName='John'">
<p>The name is <span ng-bind="firstName"></span></p>
</div>
Kendin dene " Alternatif geçerli HTML ile:
angularjs Örnek
<div data-ng-app="" data-ng-init="firstName='John'">
<p>The name is <span data-ng-bind="firstName"></span></p>
</div>
Kendin dene " Eğer sayfa, HTML geçerli kılmak istiyorsanız, yerine Ng- ait veri-Ng- kullanabilirsiniz.
Daha sonra bu eğitimde direktifleri hakkında çok daha fazla öğreneceksiniz.
angularjs İfadeler
Angularjs ifadeler çift parantezi içindeki yazılır: {{ifade}}.
Angularjs olacak "output" veri ifadesi yazılır tam olarak nerede:
angularjs Örnek
<!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>
Kendin dene " Angularjs ifadeler ng-bağlama direktifi aynı şekilde HTML angularjs verileri bağlamak.
angularjs Örnek
<!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>
Kendin dene " Daha sonra bu eğitimde ifadeler hakkında daha fazla öğreneceksiniz.
Uygulamalar angularjs
Angularjs modüller angularjs uygulamaları tanımlamaktadır.
Angularjs kontrolörleri angularjs uygulamalarını denetler.
Ng uygulama yönergesi uygulama ng kontrol cihazı yönergesi denetleyicisi tanımlamaktadır.
angularjs Örnek
<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>
Kendin dene " Angularjs modülleri uygulamalarını tanımlar:
angularjs Modülü
var app = angular.module('myApp', []);
kontrolörleri kontrol uygulamaları angularjs:
angularjs Kontrolörü
app.controller('myCtrl',
function($scope) {
$scope.firstName= "John";
$scope.lastName= "Doe";
});
Sen modülleri ve daha sonra bu eğitimde kontrolörleri hakkında daha fazla bilgi edineceksiniz.