Özel angularjs yönerge: Şablondaki yönergelerin sayısını en aza indirmeli miyim?

Question

Kendi özel yönergelerim şablonunda kullanılan direktiflerin sayısını en aza indirmek için en iyi uygulama olarak kabul edilip edilmediğini merak ediyorum.

Bir örnek verelim. Düzen para birimlerine bir yönerge oluşturduğumu ve kullanıcının bunlardan birini seçmesine izin verdiğimi varsayalım. Bu gibi görünebilir: Ben şablondan içinden ng-click kullanıyorum

function SelectCurrencyDirective(){ 
    return { 
    restrict: 'E', 
    scope: { 
     currencies: '<', 
     onChange: '&' 
    }, 
    template: [ 
     '<div class="someContainer">', 
     '<div ng-repeat="currency in currencies track by currency.symbol" ng-click="ctrl.updateSelected(currency)">{{currency.symbol}}</div>', 
     '</div>' 
    ].join(''), 
    controller: SelectCurrencyCtrl, 
    controllerAs: 'ctrl' 
    } 

} 

SelectCurrencyCtrl.$inject = ['$scope'] 
function SelectCurrencyCtrl($scope){ 
    var ctrl = this; 

    // We need to unwrap the function first 
    $scope.onChange = $scope.onChange(); 

    ctrl.updateSelected = function(currency){ 
    ctrl.selected = currency; 
    $scope.onChange(currency); // activate the callback 
    } 
} 

İşte. Ancak bir bağlantı işlevi yazmayı seçebilir ve element.on('click', doSomething) gibi bir şey kullanarak tıklama etkinliğini dinleyebilirim.

Sorum şu: Bu bağlantı işlevini ng tıklama üzerinde kullanmak en iyi yöntem midir? Niye ya? Bağlantı işlevi yerine ng tıklama çözümünü kullanmak için bir performans cezası var mı?

Answer 1

AngularJS'deyken, açısal yönergeleri kullanmak en iyi yöntem olduğunu düşünüyorum. Bu şekilde, AngularJS model değişikliklerini izlemeyi bilir. Model değişirse, AngularJS DOM'yi yeniden oluşturur.

Yani, örneğin

ctrl.updateSelected = function(currency){ 
    ctrl.selected = currency; 
    $scope.selectedCurrency = currency; // change on $scope 
} 

için ve HTML'nize

<p>10{{selectedCurrency.symbol}}</p> 

Yani DOM değişti ve yeni para birimi simgesi sergileyecek.