Özel yönerge için geçiş parametresi

Question

Bileşenlerle Açısal 1.5'i kullanma.

özel yönergesini içeren Bazı ana HTML:

<my-thing resetFields='$ctrl.bReset'></my-thing> 

DÜZENLEME: yerine resetFields arasında, burada ben reset-fields kullanılmış olmalıdır - Aşağıda tanımsız var neden bu oldu.

Veli kontrolörü:

alert(ctrl.reset); // alert is called in controller, but shows undefined 
function myThingComponent() { 
      this.controller = {}; 
      this.bindings = {}; 
      var component = this; 
      component.templateUrl = 'myThing.html'; 
      component.controller = myThingCtrl; 
      component.transclude = true; 
      component.bindings = { 
       resetFields: '<' // one way binding is needed 
      }; 
     } 

Nasıl böyle parametreyi göndermek ve özel yönergesinin denetleyicisi onu kullanabilirsiniz - myThingCtrl:

İşte

function parentController() { 
      var ctrl = this; 
      ctrl.bReset= true; 
     } 

myThing için bileşen beyanı nedir? Sıfırlama değeri doğruysa, bazı eylemleri gerçekleştirir ve başka bir eylemde yanlış gerçekleştirir.

angular.module("yourModule") 
    .directive("myThing",function(){ 
     return { 
      ... 
      restrict : "E", 
      scope:{ 
        reset:"=reset", 
        .... 
      }, 
      ..... 
      } 
     } 
    }); 

bileşeni şekilde: Eğer aşağıdaki gibi bir direktif oluşturmak zorunda da arşiv Bu propouse için

Answer 1

- (Ben çocuk bileşenlerin içinde ebeveynden bir değerini okumak nasıl olabilir sanırım Genellikle sorudur.)

angular.module('yourModule').component('myThing', { 
... 
    bindings: { 
    reset: '=' 
    } 
}); 

önemli nokta duymak "= ile yukarıdaki gibi bir kapsam propertie kullanabilir ve bu reset demek (sol kısmında reset) özelliğini sizin yönergede bir kapsam özellikleri adlandırılmış reset ile binded edilir (= rigth parçası reset) 'dir "diyorsun ki sende iki yönlü veri bağlama.

Ben bu

Answer 2

İşte o animasyonlu sayaç vermektedir yapılmış basit bir yönerge gelen bir örnek yardımcı olabilir umuyoruz.

function numberCounter($interval) { 
    var directive = { 
     restrict: 'E', 
     scope: { 
      start: '@start', 
      end: '@end', 
      speed: '@speed' 
     }, 
     template: '<% number | number : 0 %>', 
     link: link 
    }; 

    ... 
} 

Ardından, scope.start, scope.end ve scope.speed işlevlerini link işlevinin içinde kullanabilirsiniz. Başlangıç, bitiş ve hız özelliklerdir.