2014-10-16 2 views
4

Я создаю угловое приложение и хочу динамически загружать контроллер. Я вижу, вы можете использовать модуль, называемый ocLazyLoad (найдено здесь https://github.com/ocombe/ocLazyLoad)AngularJs зависает при динамическом загрузке контроллера с OcLazyLoad

Теперь я уверен, что сделал все, что мне нужно (очевидно, сделал что-то не так), но когда я пытаюсь запустить свое приложение, ничего не загружается, а браузер просто замерзает. если я нормально загружаю контроллер, он работает нормально, и вся страница загружается.

Вот код

app.js

var App = angular.module('MyApp', ['ui.router', 'ngStorage', 'ngCookies', 'pascalprecht.translate', 'oc.lazyLoad']); 

config.state.js

App.config(['$stateProvider', '$httpProvider', '$locationProvider', '$urlRouterProvider', '$controllerProvider', '$compileProvider', '$filterProvider', '$provide', '$ocLazyLoadProvider', 
    function ($stateProvider, $httpProvider, $locationProvider, $urlRouterProvider, $controllerProvider, $compileProvider, $filterProvider, $provide, $ocLazyLoadProvider) { 

     'use strict'; 

     // enable html5Mode 
     $locationProvider.hashPrefix('!').html5Mode(true); 

     // defaults to home 
     $urlRouterProvider.otherwise('/admin/settings'); 

     // config ocLazyLoad  
     $ocLazyLoadProvider.config({ 
      events: true 
     }); 


     App.controller = $controllerProvider.register; 
     App.directive = $compileProvider.directive; 
     App.filter = $filterProvider.register; 
     App.factory = $provide.factory; 
     App.service = $provide.service; 
     App.constant = $provide.constant; 
     App.value = $provide.value; 

     // states 
     $stateProvider 
      .state('admin', { 
       url: '/admin', 
       abstract: true, 
       controller: 'AdminController', 
       templateUrl: basePath('admin/admin.html') 
      }) 
      .state('admin.settings', { 
       url: '/settings', 
       controller: 'SettingsController', 
       templateUrl: basePath('admin/settings/settings.html'), 
       resolve: { 
        loadController: ['$ocLazyLoad', function ($ocLazyLoad) { 
         return $ocLazyLoad.load({ 
          name: 'admin-settings', 
          files: ['/Scripts/app/components/admin/settings/settings-controller.js'] 
         }); 
        }] 
       } 

      }); 
     }); 

     function basePath(uri) { 
      return '/Scripts/app/components/' + uri; 
     }; 
    }]); 

админа controller.js

App.controller('AdminController', ['$rootScope', '$scope', '$state', '$localStorage', '$translate', '$timeout', '$window', function ($rootScope, $scope, $state, $localStorage, $translate, $timeout, $window) { 
    'use strict'; 

    //... some code here 
}]); 

настройки-контроллер. js

App.controller('SettingsController', ['$scope', function ($scope) { 
    console.log("settings loaded"); 
}]); 

index.html (с использованием ASP.NET MVC)

<!DOCTYPE html> 
<html ng-app="MyApp"> 
<head> 
    <title ng-bind="models.helloAngular"></title> 
    @Styles.Render("~/Content/css") 
    <link rel="stylesheet" href="~/Content/app.css" /> 
</head> 
<body class="layout-boxed"> 
    <section class="wrapper" ui-view></section> 

    @Scripts.Render("~/bundles/angular") 
    @Scripts.Render("~/bundles/angular-translate") 
    @Scripts.Render("~/bundles/angular-storage") 
    @Scripts.Render("~/bundles/app") 

</body> 
</html> 

admin.html

<!-- Main section--> 
<section> 
    <!-- Page content--> 
    <div ui-view autoscroll="false" ng-class="app.viewAnimation" class="content-wrapper"> 

    </div> 
</section> 

settings.html

<div>here</div> 
+0

Я сейчас решаю ту же проблему, но до сих пор у меня нет никакого решения. – misco

+0

Я связался с разработчиком на github. Если вы можете дать ему пример приложения, он исправит его – Gillardo

+0

есть ли ошибка в OcLazyLoad? – misco

ответ

-1

положить следующий код в контроллере Js

(function() { 
     angular.module('MyApp').controller(('AdminController', ['$rootScope', '$scope', '$state', '$localStorage', '$translate', '$timeout', '$window', function ($rootScope, $scope, $state, $localStorage, $translate, $timeout, $window) { 
     'use strict'; 

     //... some code here 
    }]); 
})());