CODEWITHSUNDEEP
angularjs
amcdnl
amcdnl

Reputation: 8638

AngularJS Directive Default Options Cloning

I have a angularjs directive that I crafted. It has a defaults object that looks like:

module.constant('tableDefaults', {
    hasHeader: true,
    paging: {
         autoPageSize: true,
         count: undefined,
         pageSize: undefined
    }
});

the directive consumes that constant and merges the options passed in like:

module.directive('ngTable', function ($rootScope, tableDefaults) {
    return {
        restrict: 'AE',
        transclude: true,
        replace: true,
        require: '^ngModel',
        templateUrl: 'common/components/table/views/table.tpl.html',
        controller: function(){
            // freaks out if removed ...
        },
        link: function ($scope, $element, $attributes, ctrls) {
            if(!$scope.tableOptions) $scope.tableOptions = {}
            $scope.tableOptions = angular.copy(tableDefaults, $scope.tableOptions);
        } 
    };
});

I pass options in like:

<div ng-table="{ paging: { count: 100 } }" />

problem is now in my paging object, none of the other options are there. I've been looking at angular.extend vs $.extend and realize I could probably use $.extend to accomplish this but I'm trying to rid my app of jquery. Any suggestions?

Upvotes: 0

Views: 102

Answers (1)

link
link

Reputation: 1676

I tried to reproduce your problem here but I see tableOptions correctly set to tableDefaults. I don't know if the additional scope created by transclude could be a problem here (I removed it in my demo), but I dont' see how. Check the console.debug: Fiddle

Upvotes: 1

Related Questions