AngularJS code not minifying proper despite using array syntax in controllers

Question

It's a well known issue in angular to need to use the special array syntax when bringing in dependencies into controllers to avoid minification problems, so I have been using that notation. But it seems that the injector is still having issues with this code that appear only after sending it through gulp-uglify.

Do other angular elements like directives also need to have this syntax be used? Also, I'm using object notation to define one of the controllers, so might that be the problem?

Some main config stuff.

var app = angular.module('musicApp', ['ngSanitize']);

//Whitelist Soundcloud
app.config(function($sceDelegateProvider) {
    $sceDelegateProvider.resourceUrlWhitelist([
        'self',
        'https://w.soundcloud.com/**'
    ]); 
});

Directives, one with a controller in it.

app.directive('soundcloudHtml', ['$sce', function($sce){
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            scope.musicPiece.soundcloud = $sce.trustAsHtml(scope.musicPiece.soundcloud);
        }
    }
}]);

app.directive('music', function(){
    return {
        restrict: 'E',
        scope:{
            type: '='
        },
        templateUrl: '/resources/data/music/music.html?po=343we', 
        link: function(scope, element, attrs) {
        },
        controller: ['$http', '$scope', function($http, $scope){
                        this.musicList = [];
                        $scope.Utils = Utils;
                        var ctrl = this;

                        $http.get('/resources/data/music/music.json').success(function(data){
                            ctrl.musicList = data;
                            Utils.updateTableOfContents();
                        });
                    }], 
        controllerAs: 'musicCtrl'
    };
});

Ah cool! Looks like the config is what was missed. That fixed the problem! — Saxophlutist, Sep 16 '14 at 20:13

score 1 · Answer 1 · answered Sep 16 '14 at 20:14

Looks like I missed that config also needs that pattern as well in order to be minified. The config should be

//Whitelist Soundcloud
app.config(['$sceDelegateProvider', function($sceDelegateProvider) {
    $sceDelegateProvider.resourceUrlWhitelist([
        'self',
        'https://w.soundcloud.com/**'
    ]); 
}]);

And not

//Whitelist Soundcloud
app.config(function($sceDelegateProvider) {
    $sceDelegateProvider.resourceUrlWhitelist([
        'self',
        'https://w.soundcloud.com/**'
    ]); 
});

AngularJS code not minifying proper despite using array syntax in controllers

1 Answers1