想为角度路线调用外部控制器答案

【问题标题】：Want to call external controller for angular route想为角度路线调用外部控制器
【发布时间】：2014-05-25 03:13:29
【问题描述】：

我有角度路线工作，但我被困在我不确定是否可能的特定部分。我想使用外部控制器文件。

工作代码示例：

 app.config(function($locationProvider, $routeProvider) {
        $locationProvider.html5Mode(true);
        $routeProvider
            .when('/', {
                templateUrl: '/AngularViews/Home/index.html'
            }).when('/Login', {
                templateUrl: 'AngularViews/Account/index.html',
                controller: 'registerUser'
            }).otherwise({ redirectTo: '/'});
    });

    app.controller('registerUser', function($scope) {
        $scope.hello = 'test';
    })

我想做的更像是这样：

app.config(function($locationProvider, $routeProvider) {
    $locationProvider.html5Mode(true);
    $routeProvider
        .when('/', {
            templateUrl: '/AngularViews/Home/index.html'
        }).when('/Login', {
            templateUrl: 'AngularViews/Account/index.html',
        }).otherwise({ redirectTo: '/'});
});

用于模板登录的 HTML：

<script src="../../AngularScripts/Account/account.js"></script>
REGISTRATION

<div ng-controller="registerUser">
    {{hello}}
</div>

Account.js 文件：

app.controller('registerUser', function($scope, data) {
    $scope.hello = 'hello';
    $scope.registerUser = function () {
        var createData = {
            "UserName": $scope.email,
            "Password": $scope.password,
            "ConfirmPassword": $scope.confirmpass
        };
        console.log(createData);
        return createData;
    };
})

第二种方式时，它一直告诉我 registerUser 是未定义的，因为它找不到 registerUser

【问题讨论】：

AngularJS Dynamic loading a controller 的可能重复项
看看http://ify.io/lazy-loading-in-angularjs/
我相信那些其他帖子并不是我想要的。如果他们是我正在寻找的，他们还不够清楚

标签： angularjs

【解决方案1】：

您的registerUser 控制器必须与定义路由的应用程序定义在同一个应用程序中。如果它在另一个模块中，则该模块需要作为依赖项注入到您的主应用程序中，以及registerUser 的脚本控制器必须与您的应用定义同时引入。见plunk。

【讨论】：

所以我看到你在脚本“registerUserController”中购买了主索引。这样我就不必带上我所有的控制器了。当我在这些观点上时，我只想引入我需要的那些。
在这种情况下，您需要像 this 这样的东西，这就是我用来在一个巨大的 Angular 项目中延迟加载我的控制器的东西。

【解决方案2】：

app.controller('registerUser', function($scope, data) {

当它被调用时，几乎没有任何反应。 angular.module.controller 告诉 Angular 你想注册一个控制器，但真正的注册发生在以后，当应用程序被引导时。因此，在运行应用程序期间的任何调用都是徒劳的。

控制器的注册是通过$controllerProvider.register(name, function) 完成的。不幸的是，当应用程序已经运行时，您无法直接访问$controllerProvider。我们需要作弊。将以下内容添加到您的配置块中：

app.config(function($locationProvider, $routeProvider, $controllerProvider) {
  ...
  app.$controllerProvider = $controllerProvider;

在您的 Account.js 文件中，您可以使用实例化控制器

app.$controllerProvider.register('registerUser', function($scope, data) {

【讨论】：