Question

我希望在通过视图加载控制器时添加动态控制器的脚本。

这是我的文件树：

的index.html
app.js
视图
- prod.html
- cat.html
控制器
- prod.js
- cat.js

我希望当用户获得/prod/网址时，应用会动态加载（在视图中）prod.html和prod.js控制器逻辑。
所有这些逻辑当然都需要ng-route。

的index.html

<body data-ng-app="myApp">
  <div data-ng-view=""></div>  
</body>

Default.js 使用AngularJS v1.3.14

var app = angular.module('myApp', ['ngRoute']);

app.config(function ($routeProvider, $locationProvider, $controllerProvider, $provide) {
    $locationProvider.html5Mode({
        enabled: true,
        requireBase: false
    });

    app.registerCtrl = $controllerProvider.register;

    $routeProvider.
      when('/:name', {
          templateUrl: function (urlAttr) {
              return '/views/' + urlAttr.name + '.html';
          }
      });

    // This code throw error: 
    //TypeError: undefined is not a function
    //at angular.min.js:1
    //at r (angular.min.js:1)
    //at at (angular.min.js:1)
    //at b (angular.min.js:1)
    //at b (angular.min.js:1)
    //at b (angular.min.js:1)
    //at b (angular.min.js:1)
    //at $get.t (angular.min.js:1)
    //at angular.min.js:1
    //at p.$get.p.$eval (angular.min.js:1)
    $provide.decorator('$controller', ['$delegate', function ($delegate) {
      // I want to get the controller name and than load the js file.
      //    return function (constructor, locals) {
      //        if (typeof constructor == "string") {
      //            locals.$scope.loadControllerScript(constructor);
      //        }
      //        return $delegate(constructor, locals);
      //    }
    }]);
});

Prod.html

<div class="row" data-ng-controller="prodCtrl">
{{test}}  
</div>

Prod.js

app.registerCtrl('prodCtrl', function ($scope) {
    $scope.test = '';
});

问题是错误：“undefined不是函数”。（参见Default.js中的代码）
如果问题不明确，我将很乐意解释更多。

Answer 1

在配置阶段，您不能要求实例（例如$ controller）。您只能访问那里的提供商。查看docs：

配置块 - 在提供商注册和配置阶段执行。只有提供者和常量可以注入配置块。这是为了防止在服务完全之前意外实例化服务构造

更新：这有效：

var app = angular.module("myApp", ['ng'], ['$provide', function($provide) {
    $provide.decorator('$controller', ['$delegate',  function($delegate) {
        return function(constructor, locals) {
            console.log("executing custom code ...");
            return $delegate(constructor, locals);
        }
    }])
}]);

选中此demo

$ provide.decorator $ controller返回throw undefined不是一个函数angularjs

1 个答案: