Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

AngularJS : minification issue in directive

I have yet another issue with minification. This time it's because of the $scope service passed to the directive's controller. See below code:

angular.module('person.directives'). directive("person", ['$dialog', function($dialog) { return {     restrict: "E",     templateUrl: "person/views/person.html",     replace: true,     scope: {         myPerson: '='     },          controller: function ($scope)     {                            $scope.test = 3;                        } } }]); 

If I comment out the controller part, then it works fine.

As you can see, I've used the array declaration for the directive, so the $dialog service is known to Angular even after minification. But how am I supposed to do it for the $scope service on the controller ?

like image 634
Sam Avatar asked Apr 17 '13 08:04

Sam


1 Answers

You need to declare a controller as follows:

controller: ['$scope', function ($scope)     {                            $scope.test = 3;                        }] 

Full example here:

angular.module('person.directives'). directive("person", ['$dialog', function($dialog) { return {     restrict: "E",     templateUrl: "person/views/person.html",     replace: true,     scope: {         myPerson: '='     },          controller: ['$scope', function ($scope)     {                            $scope.test = 3;                        }] } }]); 

A solution provided by @Sam would work to but it would mean exposing directive's controller to the whole application which is unnecessary.

like image 65
pkozlowski.opensource Avatar answered Oct 02 '22 16:10

pkozlowski.opensource