3

我是一个完整的 Angular 菜鸟，并试图快速做一些花哨的事情，所以如果这是一个愚蠢的问题，请原谅我。

我创建了一个使用路由的网站，并且我使用 ui-router 进行路由，而不是标准的 Angular 路由器。理论还是一样的——我的网站根目录中有一个 index.html 页面，它是“主”或“主机”页面，而作为部分的 loginView.htm 存在于单独的目录中。

项目的 mainController 加载在 index.html 页面中。引用此控制器不会导致错误或问题。

为了保持代码的可管理性和小型化，我想做的是在我加载部分页面时使用自定义控制器来延迟加载部分页面，然后将该部分页面与新加载的控制器相关联。有道理，对吧？我不想默认加载所有控制器，因为那是浪费时间和空间。

所以我的结构看起来像这样（如果它对任何人都很重要）：

Root
--app/
----admin/
------login/
--------loginView.html
--------loginController.js
--mainController.js
index.html

这是我的登录控制器代码。出于测试目的，我使 mainController 代码完全匹配。

var loginController = function ($scope, $translate) {
    $scope.changeLanguage = function (key) {$translate.use(key); };
};

angular.module('app').controller('loginController', loginController);

最后，这是我的路由代码：

function config($stateProvider, $urlRouterProvider, $ocLazyLoadProvider) {

    $urlRouterProvider.otherwise("/admin/login");

    $stateProvider
        .state('login', {
            url: "/admin/login",
            templateUrl: "app/admin/login/loginView.html",
            controller: loginController,
            resolve: {
                loadPlugin: function ($ocLazyLoad) {
                    return $ocLazyLoad.load([
                        {
                            name: 'loginController',
                            files: ['app/admin/login/loginController.js']
                        }
                    ]);
                }
            }
        })
    ;
}

angular
    .module('app')
    .config(config)
    .run(function ($rootScope, $state) {
        $rootScope.$state = $state;
    });

现在 - 如果我删除整个“解决”部分，并将控制器更改为“mainController”，一切正常。页面加载，按钮工作，它们调用“changeLanguage”功能，一切都很棒。

但我希望“changeLanguage”功能驻留在 loginController 中，因为这是唯一使用它的页面。因此，当代码看起来像上面那样时，会触发错误（“Uncaught Error: [$injector:modulerr]”）并且部分页面无法加载。

我不明白我做错了什么，也没有通过谷歌找到我需要的东西（也许我只是不知道要问的正确问题）。

帮助？

4

1 回答 1

4

浏览文档我找不到ocLazyLoad#loadname的属性。

尝试以下操作：

resolve: {
  loadPlugin: function ($ocLazyLoad) {
    return $ocLazyLoad.load(['app/admin/login/loginController.js']);
  }
}

或者，在配置块中预先配置它：

app.config(function ($ocLazyLoadProvider) {
  $ocLazyLoadProvider.config({
    modules: [{
      name: 'loginController',
      files: ['app/admin/login/loginController.js']
    }]
  });    
});

// then load it as: 

$ocLazyLoad.load('loginController');
于 2015-07-17T07:51:56.813 回答