Question

如果我想分配动态控制器，我可以执行以下操作：

<div ng-controller="MainController">
  <div ng-controller="dynamicController"></div>
</div>

function MainController($scope){
  $scope.dynamicController = MyCtrl;
  $scope.instanceName = "ctrl"; // we'll use this later
}

function MyCtrl(){}

我可以做些什么来使用新的“控制器为”语法？

这很好用：<div ng-controller="dynamicController as ctrl"></div>

但是如何使ctrl动态呢？假设我希望它的名称$scope.instanceName成立。

小提琴：http://jsfiddle.net/ftza67or/2/

有一个想法是创建一个自定义指令来创建和编译html字符串，但这是一个丑陋的方式，让我们假装它不存在。

Answer 1

这应该几乎相同，但请记住，当您使用controller as时，您可以将属性绑定到控制器内的this，以便通过范围/视图访问它们。

＆＃13;

function MainController ($scope) {
  $scope.dynamicController = MyCtrl;
  }

function MyCtrl($scope) {
  this.foo = "baz";
  }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
<div ng-controller="MainController">
  <div ng-controller="dynamicController as ctrl">
    {{ctrl.foo}}
  </div>
</div>

＆＃13;

Answer 2

所以我调查了角度来源并发现了这一点。 https://github.com/angular/angular.js/blob/bf6a79c3484f474c300b5442ae73483030ef5782/src/ng/controller.js

 if (isString(expression)) {
    match = expression.match(CNTRL_REG),
    constructor = match[1],
    identifier = identifier || match[3];
    expression = controllers.hasOwnProperty(constructor)
        ? controllers[constructor]
        : getter(locals.$scope, constructor, true) ||
            (globals ? getter($window, constructor, true) : undefined);
  .... and so on

基本上，ng-controller指令当前接受字符串或表达式，如果它是表达式，则它必须是控制器函数引用。如果它是一个字符串，那么它将采用标识符名称，因为它已被传递，我没有看到任何方法使它评估具有动态表达式名称的变量。

具有“控制器为”语法的动态控制器

2 个答案: