Sadece angularjs ile başladım ve Açısal direktifleri birkaç eski bir JQuery eklentileri dönüştürme üzerinde çalışıyorum. Bir öznitelik seçenek değeri belirterek kılınabilir (element) talimatımı için varsayılan seçenekleri bir dizi tanımlamak istiyorum.

Etrafına bir bak başkaları yapmış şekilde yaşadım, ve angular-ui kütüphane ui.bootstrap.pagination benzer bir şey yapmak gibi görünüyor.

Öncelikle varsayılan seçenekler sabit bir nesne olarak tanımlanır:

.constant('paginationConfig', {
  itemsPerPage: 10,
  boundaryLinks: false,
  ...
})

O getAttributeValue yardımcı fonksiyon Direktifi denetleyicisine bağlı

this.getAttributeValue = function(attribute, defaultValue, interpolate) {
    return (angular.isDefined(attribute) ?
            (interpolate ? $interpolate(attribute)($scope.$parent) :
                           $scope.$parent.$eval(attribute)) : defaultValue);
};

Sonunda, bu niteliklerini okumak için bağlama işlevi kullanılır

.directive('pagination', ['$parse', 'paginationConfig', function($parse, config) {
    ...
    controller: 'PaginationController',
    link: function(scope, element, attrs, paginationCtrl) {
        var boundaryLinks = paginationCtrl.getAttributeValue(attrs.boundaryLinks,  config.boundaryLinks);
        var firstText = paginationCtrl.getAttributeValue(attrs.firstText, config.firstText, true);
        ...
    }
});

Bu varsayılan değerler yerine isteyen standart gibi bir şey için oldukça karışık bir düzen gibi görünüyor. Başka yolları da ortak olan bunu yapmak için var mı? Ya da her zaman getAttributeValue ve bu şekilde ayrıştırma seçenekleri gibi yardımcı bir işlev tanımlamak için normal mi? Farklı stratejiler insanlar bu ortak bir görev için ne öğrenmek için ilgileniyorum.

Ayrıca, bir bonus olarak, interpolate parametre gereklidir neden emin değilim.

Direktifin kapsamı blok özelliği =? bayrağı kullanın.

angular.module('myApp',[])
  .directive('myDirective', function(){
    return {
      template: 'hello {{name}}',
      scope: {
        // use the =? to denote the property as optional
        name: '=?'
      },
      controller: function($scope){
        // check if it was defined.  If not - set a default
        $scope.name = angular.isDefined($scope.name) ? $scope.name : 'default name';
      }
    }
  });