AngularJS : kapsam.$ve kapsamı. dikkat et$Uygula

SORU

27 ŞUBAT 2013, ÇARŞAMBA

AngularJS : kapsam.$ve kapsamı. dikkat et$Uygula

scope.$watch scope.$apply kullanmak için nasıl anlamıyorum. Resmi belgelere yararlı değildir.

Ben özellikle neyi anlamıyorum:

DOM mı bağlı?
Nasıl modeli DOM değişiklikler güncelleyebilir miyim?
Aralarında bağlantı noktası nedir?

28 ** ama verilen $watch $apply anlayışı alır.

$apply $watch ve ne şekilde onları kullanırım? ne yapmalıyım

CEVAP

27 ŞUBAT 2013, ÇARŞAMBA

Bunu anlamak için Açısal nasıl çalıştığı hakkında bilmeniz gerekir.

Ve kapsamı Özet döngüsü$

Birincisi ve en önemlisi, Açısal olarak adlandırılan bir kavram tanımlarÖzet döngüsü. Bu döngü eğer tüm değişkenler için herhangi bir değişiklik, eğer var sırasında Açısal Çek bir döngü olarak kabul edilebilirizledimherkes tarafından $scopes. Eğer öyleyse, eğer $scope.myVar Denetleyici olarak tanımlanmışsa bu değişken olduizlendiğini için işaretlenmişo zaman dolaylı olarak Açısal söylüyorsun değişiklikleri izlemek için myVar Her döngü içinde döngü.

Soru takip olurdu doğal olarak: her şeyi $scope izleniyor takılmış mı? Neyse ki, Hayır. Eğer hızlı bir şekilde $scope Özet döngü içinde her nesne için yapılacak değişiklikler dikkat edersen yaş değerlendirmeye alacağını ve hızlı bir şekilde performans sorunları çalıştırmak. Bu yüzden Açısal bize izleniyormuş gibi $scope bazı değişken bildirmek için iki yol (aşağıda okuyun) verdi.

izlemek için $kapsam değişiklikleri dinlemek için yardımcı olur. $

İzleniyormuş gibi $scope bir değişken bildirmek için iki yol vardır.

İfade yoluyla şablonu kullanarak: <span>{{myVar}}</span>
Elle $watch servis üzerinden ekleyerek

Reklam 1) Bu en yaygın senaryo ve daha önce gördünüz eminim, ama bu arka planda bir saat yarattı sen bunu bilmiyordun. Evet vardı! Açısal direktifleri (ng-repeat gibi) kullanarak da örtülü saatler oluşturabilirsiniz.

Reklam 2) Eğer nasıl olduğunusaatler. $watch servis siz değer $scope bağlı değiştiğinde bazı kod çalıştırmak için yardımcı olur. Nadiren kullanılır, ama bazen faydalıdır. Eğer bazı kod her zaman 'değişkenim' değişiklikler, aşağıdakileri yapabilirsiniz: . çalıştırmak istiyorsanız örneğin,

function MyController($scope) {

   $scope.myVar = 1;

   $scope.$watch('myVar', function() {
       alert('hey, myVar has changed!');
   });

   $scope.buttonClicked = function() {
      $scope.myVar = 2; // This will trigger $watch expression to kick in
   };

}

sağlar sindirimi döngüsü ile değişiklikleri entegre etmek için uygulanır. $

Düşünebilirsiniz$apply bir entegrasyon mekanizması olarak işlev. Sen, her zaman biraz değişiklik göremiyorumizlenen değişken $scope bağlınesne doğrudan, Açısal değişim oldu. Bu Açısal zaten bu değişiklikleri izlemek için biliyordu çünkü. Eğer öyleyse kod çerçevesi tarafından yönetilen olursa, sindirimi döngüsü devam edecek. Ancak, bazenAçısal dünyanın dışında bir değeri değiştirinve bu değişiklikler genellikle yaymak bakın. Bu düşünün - $.ajax() bir jQuery içinde değiştirilecek $scope.myVar değeri işleyicisi var. Bu gelecekte bir noktada olacak. Açısal jQuery üzerinde bekleme talimatı olmadı, bu şekilde olmasını bekle. Bu mücadele, $apply getirilmiştir. Sizin sindirim döngüsü açıkça başlatmak için sağlar. Ancak, sadece bu Açısal (diğer çerçeveler ile entegrasyon) için bazı veriler geçirmek için kullanın, ama asla Açısal bir hata daha sonra atmak için bu yöntemi düzenli Açısal kodu ile birlikte kullanmalısınız.

Nasıl bu tüm DOM ile ilgili?

Aslında tüm bu biliyorsunuz artık öğretici tekrar izleyin. Özet döngüsü UI ve JS kodunu senkronize kalmasını, her izleyici hiçbir şey değişmez sürece s $scopebağlı değerlendirerek yapacaktır. Artık değişiklikleri Özet döngü içinde olursa, o zaman bitmiş sayılır. Ya da açıkça {{expression}} görünümünde doğrudan formunda ilan ederek Denetleyicisi, veya $scope nesne nesneleri ekleyebilirsiniz.

Bu konuda bazı temel bilgileri açıklamak için yardımcı olur umarım.

Daha fazla okuma: