如何在AngularJS中动态注入控制器

时间:2013-06-27 13:23:57

标签: javascript angularjs angularjs-scope

如何将ng-controller设置为$scope的表达式?

根据documentation

  

ngController - {expression} - 全局可访问的名称   构造函数或当前作用域上的表达式   求值为构造函数。

但是如何将范围表达式评估为已向模块.controller注册的控制器的控制器?

例如:

布局:

<div ng-controller="myExpr"></div>

JavaScript(定义控制器):

app.controller('myCtrl', ['$scope', '$timeout', function () { ... }];

JavaScript(父范围):

$scope.myExpr = ...;

在myExpr中应该通过表达式将myCtrl用作控制器?

我试过$controller('myCtrl') ...没有工作......

P.S。如果通过全局可访问函数定义了控制器,则可以将其作为myExpr提供。但如果定义了怎么办呢?

1 个答案:

答案 0 :(得分:1)

ng-controller接受的表达式有点奇怪。所以你可以通过略微区别地编写你的控制器来做到这一点(但请阅读下面你可能不想要的原因)。

function myCtrl($scope) {
  $scope.value = 'Stuff';
}

这是一个控制器,在这种情况下可以正常工作。就像在这个例子中一样:http://jsbin.com/ubevel/2/edit

为什么不这样做?
首先,这不是从测试角度定义事物的好方法。其次,这允许您在加载时动态设置控制器,但之后不允许您更改。如果在页面加载后更改myExpr 的值,控制器将不会更改。

那该怎么办?
我强烈建议改为使用服务。通过向外部控制器提供服务来交换您的操作,然后您以与现在尝试更改内部控制器相同的方式更改服务。类似于:http://jsbin.com/ubevel/5/edit

此服务可以即时交换,更改它将更改范围内可用的操作。

您也可以使用包含,但这会导致重复的HTML。我个人很好,因为我反对重复使用html两个不同类型的对象(迟早你想改变一个而不是另一个,它变得一团糟)。但很多人会反对。



一个额外的注意事项:使用控制器可能有更好的方法,我可能没有看过所有角度,但我认为控制器不适合这种情况。