Merhaba bugünkü konu şu başlıklar altında işlenmiş
$scope bildiğiniz gibi sadece bulunduğu controller'ın altında kullanılabiliyordu. Peki biz aynı değişkenleri farklı controllerlarda kullanmak istersek ? Burada ise bizim imdadımıza $rootScope yetişiyor. Örnek olarak title diye bir değişkenimiz var ve bunu bir üst controller'da kullamayız.
<!DOCTYPE html>
<html lang="en" ng-app="proje">
<head>
<meta charset="UTF-8">
<title>Proje</title>
<script src="resources/angular.min.js"></script>
<script src="app.js"></script>
<script>
Proje.controller('UstCtrl', function($rootScope){
});
Proje.controller('AltCtrl', function($scope){
$scope.title = "AltCtrl Başlık";
})
</script>
</head>
<body>
<div ng-controller="UstCtrl">
Üst : {{title}} <br>
<div ng-controller="AltCtrl">
Alt : {{title}} <br>
</div>
</div>
</body>
</html>
Gördüğünüz üzere "Üst: " diyerek boş verdi bunun yerine $rootScope.title diye kullansaydık. O zaman çalışırdı.
$rootScope.title = "AltCtrl Başlık";
ng-hide directivine girilen koşul true ise gizler,
ng-show directivine girilen koşul true ise gösterir, Örnek:
<div ng-hide="true">Gizlenir</div>
<div ng-show="true">Gösterilir</div>
<div ng-hide="false">Gösterilir</div>
<div ng-show="false">Gizlenir</div>
ng-focus nesneye odaklandığı an tetiklenir. ng-blur odak kayıp olduğunda tetiklenir. Örneğin bir nesneye odakladığında işlem yapıp kaybettiğinde işlem yapmak istiyorsak.
<!DOCTYPE html>
<html lang="en" ng-app="proje">
<head>
<meta charset="UTF-8">
<title>Proje</title>
<script src="resources/angular.min.js"></script>
<script src="app.js"></script>
<script>
Proje.controller('AppCtrl', function($scope){
$scope.focus = function () {
$scope.yazi = "odakladın";
};
$scope.blur = function() {
$scope.yazi = "odak gitti";
}
});
</script>
</head>
<body ng-controller="AppCtrl">
<input type="text" placeholder="Bana odaklan" ng-focus="focus()" ng-blur="blur()">
{{yazi}}
</body>
</html>
Bugünkü ders bu kadardı diğer derste görüşmek üzere :)
Düşündüklerin nedir ?
