SORU
23 Temmuz 2012, PAZARTESİ


kapsamında AngularJS denetleyicileri bu vs $

** 35, orada bu örnek:

controller: function($scope, $element) {
  var panes = $scope.panes = [];
  $scope.select = function(pane) {
    angular.forEach(panes, function(pane) {
      pane.selected = false;
    });
    pane.selected = true;
  }
  this.addPane = function(pane) {
    if (panes.length == 0) $scope.select(pane);
    panes.push(pane);
  }
}

5 ** yöntem $scope, eklenir ama addPane yöntem this eklendiğine dikkat edin. I $scope.addPane kod sonları ile değiştirmek.

Doktorlar aslında bir fark var ama ne fark söz yok ki:

Açısal önceki sürümleri (pre 1.0 RC) yerine $scope yöntemi ile this kullanmak için izin, ama bu artık bir durumdur. Yöntem kapsamında tanımlanan içinde this $scope değiştirilebilir $scope 14 *ayarlar açısal (), ama aksi takdirde kumandanız içinde yapıcı değil.

Nasıl this $scope AngularJS denetleyicileri.

CEVAP
5 Ocak 2013, CUMARTESİ


"Nasıl 'bu' ve $AngularJS denetleyicileri kapsam iş?"

Kısa cevap:

  • this
    • Denetleyicisi yapıcı işlevi çağrıldığında, this kontrol ünitesi.
    • Bir fonksiyon kapsam nesne bir $üzerinde tanımlı çağrıldığında, this işlevi çağrıldığında "etkisi kapsam". Bu olabilir (ya da olmayabilir!) işlevi tanımlanan kapsam$. Yani, fonksiyon, this ve $kapsam içinde olabilirdeğilaynı olması.
  • $scope
    • Her denetleyici ilişkili $scope nesnesi vardır.
    • Bir denetleyici (kurucu) fonksiyonu modeli özelliklerini ayarlama sorumludur ve kapsamı, ilişkili $/davranış fonksiyonları.
    • Sadece yöntemleri kapsam nesne (ve üst kapsam nesneler, eğer prototip miras oyuna) bu $üzerinde tanımlı HTML/görünümden erişilebilir. E. g., ng-click, filtreler, vb.

Uzun cevap:

Denetleyici bir fonksiyon JavaScript yapıcı bir işlevi vardır. Kurucu yürütür (bir görünüm yüklediğinde örneğin,), this fonksiyonu (yani, "işlevi bağlamında") denetleyicisi nesnesi için ayarlanır. Neyse ki, "sekmeler" addPane işlev oluşturulduğunda denetleyicisi yapıcı işlevini

this.addPane = function(pane) { ... }

denetleyici nesne değil, dolar kapsamı üzerinde oluşturulur. AddPane bu işlevi göremez manzarası tek fonksiyonları kapsam dolar tanımlı erişebilirsiniz. HTML, bu işe yaramaz başka bir deyişle: <a ng-click="addPane(newPane)">won't work</a>.

"Sekmeleri denetleyicisi yapıcı işlevini yürütür", aşağıdaki sunuyoruz: . sonra

after tabs controller constructor function

Kesikli siyah çizgi ilk miras -- Scope kapsam prototypically devralır izole gösterir. (Yönerge HTML ile karşılaşıldı nerede prototypically etkisi kapsamından miras almaz.)

Şimdi bölmesi direktifin bağlantı işlevi sekmeleri Direktifi ile iletişim kurmak istiyor gerçekten sekmeler izole etkilemek için gereken anlamına gelir ($bir şekilde kapsamı). Olaylar olabilir, ama başka bir mekanizma require sekmeler denetleyicisi bölmesinde Direktifi var. (require kapsam sekmeleri $bölmesi yönergesi için mekanizma var gibi gözüküyor.)

Yani, bu bir soruyu akla getiriyor: eğer biz sadece sekmeleri denetleyicisine erişimi varsa, nasıl sekmelerine izole ulaşacağız $kapsamının ne olduğu)?

Peki, kırmızı noktalı çizgi cevaptır. Bu addPane() işlevi "" (JavaScript fonksiyonu kapsam/kilitler burada bahsediyorum) sekmeleri ayırmak için erişim kapsamı işlevi $veriyor. kapsam I. e., () addPane için "İsolateScope" addPane zaman oluşturulmuş bir kapanması nedeniyle yukarıdaki diyagramda() tanımlanmıştır. sekmeler (Eğer biz bunun yerine tanımlanan addPane() tırnakları $scope nesnesi bölmesi Direktifi olmazdı erişmek için bu işlevi, dolayısıyla bunun olacağını hiçbir şekilde iletişim kurmak sekmeleri $scope.)

Sorunuzun diğer kısmına cevap vermek için: how does $scope work in controllers?:

Fonksiyonlar kapsam dolar tanımlanan içinde, this ayarlanır işlevi çağrıldı "etkisi dolar kapsamı". Biz aşağıdaki HTML varsayalım:

<div ng-controller="ParentCtrl">
   <a ng-click="logThisAndScope()">log "this" and $scope</a> - parent scope
   <div ng-controller="ChildCtrl">
      <a ng-click="logThisAndScope()">log "this" and $scope</a> - child scope
   </div>
</div>

Ve ParentCtrl vardır

$scope.logThisAndScope = function() {
    console.log(this, $scope)
}

İlk bağlantı this kapsam ve işlevi "kapsam ParentCtrl ile ilişkili. çağrıldığı zaman" etkisi kapsam beri aynı, göstermek, tıklamak

İkinci linkten this ortaya çıkaracak ve kapsamı vardırdeğilbu işlev" kapsam ChildCtrl ile ilişkili. çağrıldığı zaman "etkisi kapsam beri aynı, Burada, this ChildCtrl ayarlanır. $scope. Yöntemi içinde $kapsamı hala ParentCtrl. $scope.

Fiddle

Ben denemek için kullanın. this içinde bir fonksiyon tanımlanmış dolar kapsam, olur kafa karıştırıcı bir $kapsam olarak etkilenen, özellikle de göz önünde bulundurarak ng-tekrar ediyorum, ng vardır, ng-geçiş ve direktifleri bütün oluşturmak kendi alt kapsamları.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Jonnyriddlin1

    Jonnyriddlin

    4 Ocak 2007
  • magnum33563

    magnum33563

    8 NİSAN 2011
  • POGProductionz

    POGProductio

    27 NİSAN 2012