Lazy load no Angular using Jquery

Fala galera, estou fazendo uma nova versão do portal da empresa usando angularjs e estava com bastante dificuldade de utilizar o padrão Lazy load no angular, identifiquei diversas soluções utilizando RequireJS e ocLazyLoad, mas achei muito código e complicado a forma de fazer então depois de ler a documentação do $routeProvider identifiquei que tinha a opção 'resolve', que executa um objeto que tem uma função antes da renderização da route, com isso pode utilizar a função do jquery, para dar um load no  controller antes da renderização da tela utilizando o comando '$.getScript()'.

Vamos ao exemplo para melhor entendimento.

app.js

 
/*Criação do Módulo*/  
 angular.module('app', ['ngRoute']);

 app.config(['$routeProvider', '$controllerProvider', function($routeProvider, $controllerProvider){  
   
 /*Criação de uma forma mais sintetizada do service do $controllerProvider.register*/  
    app.registerCtrl = $controllerProvider.register;  
   
    function loadScript(path) {
      var result = $.Deferred(),
      script = document.createElement("script");
      script.async = "async";
      script.type = "text/javascript";
      script.src = path;
      script.onload = script.onreadystatechange = function (_, isAbort) {
          if (!script.readyState || /loaded|complete/.test(script.readyState)) {
             if (isAbort)
                 result.reject();
             else
                result.resolve();
        }
      };
      script.onerror = function () { result.reject(); };
      document.querySelector("head").appendChild(script);
      return result.promise();
    }

    /*Função que retorna o objeto para o resolve do $routeProvider*/ 
    function loader(arrayName){

     return {
          load: function($q){
      var deferred = $q.defer(),
      map = arrayName.map(function(name) {
      if(name.match('class/|plugin/')){
       return loadScript('js/'+name+".js");
      }

  if(name.match('service/')){
   return loadScript(name+".js");
  }

  return loadScript('controllers/'+name+".js");
  });

  $q.all(map).then(function(r){
   deferred.resolve();
  });

  return deferred.promise;
      }
     };
    }

    $routeProvider   
    .when('/', {  
       templateUrl: 'views/foo.html',  
       resolve: loader('foo')  
    })  
    .when('/bar',{  
       templateUrl: 'views/bar.html',  
       controller: 'BarCtrl',  
       resolve: loader('bar')  
    })  
    .otherwise({  
       redirectTo: document.location.pathname  
    });  
  }]);   

/views/foo.html

 <section ng-controller='FooCtrl'>  
  {{text}}  
 </section>  

/controllers/foo.js

/*Aqui utilizamos a versão sintetizada do $controllerProvider.register 
para registrar o controller na view */  
app.registerCtrl('FooCtrl',function($scope){  
  $scope.text = 'Test';  
 });  

/views/bar.html

<section>  
  {{text2}}  
</section>  

/controllers/bar.js

app.registerCtrl('BarCtrl',function($scope){  
  $scope.text2 = 'Test';  
});  

Espero que tenha ajudados vocês também ;)