angularjs, load template and controller partialy using lazy load - angularjs

Question

Please help me,
I was get an error when loading partialy template view and controller in angularjs using lazyload.
I got these error message:
Error: ng:areq
Bad Argument
Argument 'meSygroupController' is not a
How to fix it, when I will build big project, so its imposible to load all javascript controller in one time while load first page. And how to apply new controller to existing module
Here some codes :
Filename : angular-app.js
var colorAdminApp = angular.module('colorAdminApp', [
'ui.router',
'ui.bootstrap',
'oc.lazyLoad'
]);
colorAdminApp.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/app/dashboard/v2');
$stateProvider
.state('app', {
url: '/app',
templateUrl: 'demo?page=template/app',
abstract: true
})
.state('app.sys', {
url: '/system',
template: '<div ui-view></div>',
abstract: true
})
.state('app.sys.sygroup', {
url: '/sygroup',
templateUrl: 'me_sygroup',
// controller: "meSygroupController",
data: { pageTitle: 'Master Grup Akses' },
resolve: {
service: ['$ocLazyLoad', function($ocLazyLoad) {
return $ocLazyLoad.load({
serie: true,
files: [
'me/meSygroupController.js',
'coloradmin/assets/plugins/jquery-jvectormap/jquery-jvectormap-1.2.2.css',
]
});
}]
}
})}]);
colorAdminApp.run(['$rootScope', '$state', 'setting', function($rootScope, $state, setting) {
$rootScope.$state = $state;
$rootScope.setting = setting;
}]);
And here template :
<div ng-controller="meSygroupController" class="frm">
<!-- <div> -->
<ol class="breadcrumb pull-right">
<li>Beranda</li>
<li>Sistem</li>
<li class="active">Grup User</li>
</ol>
<h1 class="page-header">Grup User <small>kelompok otorisasi user...</small></h1>
<!-- begin panel -->
<div class="panel panel-inverse">
<div class="panel-heading">
<div class="panel-heading-btn">
<i class="fa fa-expand"></i>
<i class="fa fa-repeat"></i>
<i class="fa fa-minus"></i>
<i class="fa fa-times"></i>
</div>
<h4 class="panel-title">Daftar Grup User</h4>
</div>
<div class="panel-body">
Panel Content Here
</div>
</div>
<!-- end panel -->
</div>
And here the controller
colorAdminApp.controller('meSygroupController', function($scope, $rootScope, $state) {
angular.element(document).ready(function() {});
$scope.test = function() { alert(111); }
$scope.test();
});
Please Helpme.
Arif Diyanto