4

I've looked at three different ways to minify AngularJS scripts. However, none of them explains how I'm supposed to take into account custom filters. I have my code formatted like this:

app.controller("App", ["$scope","$timeout", function($scope, $timeout){...}]);

Along with some additional code like this:

app.filter('unsafe', function($sce) {
    return function(val) {
        return $sce.trustAsHtml(val);
    };
});

When I minify all of the above, the filter isn't recognized anymore. How do I go about prepping my code for minification?

teobais
  • 2,820
  • 1
  • 24
  • 36
Grant Park
  • 1,004
  • 1
  • 9
  • 29
  • 1
    Look how you've defined `App`. Use same syntax for `unsafe` filter. – Tushar Jan 09 '16 at 12:49
  • u have added $sce service in ur filter while minifying the $sce will get changed into some alphabet name so u need to add dependencies in array.so angular could not be able to find tat service. – sundar Jan 09 '16 at 12:49
  • 1
    See [Why we Inject our dependencies two times in angularjs?](http://stackoverflow.com/questions/32390338/why-we-inject-our-dependencies-two-times-in-angularjs) – Tushar Jan 09 '16 at 12:50
  • app.filter('unsafe',['$sce', function($sce) { return function(val) { return $sce.trustAsHtml(val); }; }]); – sundar Jan 09 '16 at 12:50
  • Whenever you want minification, you must annotate your function like you did for App controller because after the process $sce will be named with some other name and angular wont know how to inject that thing. – Marcus Henrique Jan 09 '16 at 12:52

1 Answers1

7

app.filter('unsafe', ['$sce', function($sce) {
    return function(val) {
        return $sce.trustAsHtml(val);
    };
}]);

When minified that $sce is transformed in a variable called a so that it takes less space possible but angular doesn't recognize it anymore so you need to declare that that first parameter is still $sce but with another variable name

Matteo Cardellini
  • 876
  • 2
  • 17
  • 41