Angularjs bağlama veri modeli ve görünümü arasında senkronizasyon.
Veri örneği
uygulamalar genellikle veri modeli var angularjs. veri modeli uygulaması için mevcut veriler topluluğudur.
Örnek
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.firstname
= "John";
$scope.lastname = "Doe";
});
HTML Görünümü
Angularjs uygulama görüntülenir HTML konteyneri, görüntüleme denir.
görünümü modeline erişimi olan ve görünümde modeli verilerin görüntülenmesi çeşitli yolları vardır.
Sen kullanabilirsiniz ng-bind
belirtilen modelin özelliğine elemanın innerHTML bağlayacaktır yönergesini:
Ayrıca çift parantez kullanabilirsiniz {{ }}
{{ }}
{{ }}
Modelinden içeriğini görüntülemek için:
Yoksa kullanabilirsiniz ng-model
HTML direktif görünümüne modeli bağlamak kontrol eder.
ng-model
Direktifi
Kullanım ng-model
HTML denetimlere görünüme modelinden veri bağlamak için yönergesi (input, select, textarea)
ng-model
yönergesi modeli ve görünümü arasında bir bağlanma iki-yol sağlar.
Cilt İki yönlü
Angularjs bağlama veri modeli ve görünümü arasında senkronizasyon.
Model değişiklikleri veri, görünüm değişimi yansıtır zaman ve görünümü değişiklikleri veri modeli de güncellendiğinde. Bu model ve görünümü her zaman güncellenir emin olur ki, hemen ve otomatik olarak gerçekleşir.
Örnek
<div ng-app="myApp" ng-controller="myCtrl">
Name: <input ng-model="firstname">
<h1>{{firstname}}</h1>
</div>
<script>
var app = angular. module('myApp', []) ;
app. controller('myCtrl', function($scope) {
$scope.firstname
= "John";
$scope.lastname = "Doe";
});
</script>
Kendin dene " angularjs Kontrolörü
Angularjs uygulamalar kontrolörleri tarafından kontrol edilir. Içinde kontrolörleri hakkında okuyun angularjs Kontrolörler bölüm.
Çünkü modeli ve bakış hemen senkronizasyon, kontrol görünümünden tamamen ayrılmış olabilir, ve sadece örnek veri konsantre. Angularjs bağlanma verilere sayesinde görünümü denetleyicisi yapılan değişiklikleri yansıtır.
Örnek
<div ng-app="myApp" ng-controller="myCtrl">
<h1 ng-click="changeName()">{{firstname}}</h1>
</div>
<script>
var app = angular. module('myApp', []) ;
app. controller('myCtrl', function($scope) {
$scope.changeName
= function() {
$scope.firstname
= "Nelly";
}
});
</script>
Kendin dene "