问题描述
自我解释小提琴:
我需要动态地选择在控制器基于它的名字作为一个字符串运行时使用。该字符串将从配置对象读取。
在 InnerCtrlAsLocalVariable
的code下面我现在有一个分配给 $ scope.dynamicCtrl
。而是如何做我分配 InnerCtrlFromModule
来的财产?
查看:
< DIV NG-应用='应用'NG控制器='OuterCtrl'>
< DIV NG控制器='dynamicCtrl'>
{{信息}}
< / DIV>
< / DIV>
JS:
VAR InnerCtrlAsLocalVariable = ['$范围',
功能($范围){
$ scope.message从控制器作为本地变量 - 不想'=
}
];angular.module('应用',[]) .controller('OuterCtrl',['$范围', 功能($范围){
//不是这样做的?
$ scope.dynamicCtrl = InnerCtrlAsLocalVariable; // ...我想要做这样的事情:
// $ scope.dynamicCtrl = resolveCtrl('InnerCtrlFromModule');
}
]) .controller('InnerCtrlFromModule',['$范围',
功能($范围){
$ scope.message ='从模块定义控制器 - 要';
}
]);
您可以尝试编写自定义指令:
.directive(ngDynamicController功能($编译){
返回{
终端:真实,
优先级:1000,
链接:功能(范围,元素,属性){
VAR controllerProperty =范围[attr.ngDynamicController]
element.attr('NG控制器,controllerProperty);
element.removeAttr(NG动态控制器);
$编译(元)(范围);
}
}
})
如果您需要更多的信息,我们为什么要添加端子:真正的
和优先级:1000
。看看我的回答这个问题:Add在AngularJS
您可以尝试注入它作为一个值:
angular.module(应用,[])
.value的('InnerCtrl',InnerCtrlAsLocalVariable)
.controller('OuterCtrl',['$范围,InnerCtrl',
功能($范围,InnerCtrl){//注入值到函数
$ scope.dynamicCtrl = InnerCtrl;
}
])
或者使用$注射器动态解析:
VAR InnerCtrlAsLocalVariable = ['$范围',
功能($范围){
$ scope.message ='从模块定义控制器 - 要';
}
] angular.module('应用',[])
.value的('InnerCtrl',InnerCtrlAsLocalVariable)
.controller('OuterCtrl',['$范围,$喷油器',
功能($范围,$注射器){//注入$注射器服务。 //动态地解决价值
$ scope.dynamicCtrl = $ injector.get('InnerCtrl'); }
]) .controller('InnerCtrlFromModule',InnerCtrlAsLocalVariable)
您可以使用 $控制器
服务动态创建控制器实例,从这个实例我们可以通过检索构造函数构造
属性
angular.module(应用,[])
.controller('OuterCtrl',['$范围,$控制器,
功能(范围,$控制器){ scope.dynamicCtrl = $控制器('InnerCtrlFromModule',{$范围:$范围新的()})构造函数; }
]) .controller('InnerCtrlFromModule',['$范围',函数($范围){
$ scope.message ='从模块定义控制器 - 要';
}])
Self explanatory fiddle: http://jsfiddle.net/5FG2n/6/
I need to dynamically choose the controller to use at runtime based on its name as a string. The string will be read from a config object.
In the code below I currently have InnerCtrlAsLocalVariable
assigned to $scope.dynamicCtrl
. How instead do I assign InnerCtrlFromModule
to the property?
View:
<div ng-app='app' ng-controller='OuterCtrl'>
<div ng-controller='dynamicCtrl'>
{{message}}
</div>
</div>
JS:
var InnerCtrlAsLocalVariable = ['$scope',
function($scope) {
$scope.message = 'from controller as local variable - do not want'
}
];
angular.module('app', [])
.controller('OuterCtrl', ['$scope',
function($scope) {
// Instead of doing this...
$scope.dynamicCtrl = InnerCtrlAsLocalVariable;
// ...I want to do something like this:
// $scope.dynamicCtrl = resolveCtrl('InnerCtrlFromModule');
}
])
.controller('InnerCtrlFromModule', ['$scope',
function($scope) {
$scope.message = 'from controller defined in module - want';
}
]);
You could try writing custom directive:
.directive("ngDynamicController",function($compile){
return {
terminal: true,
priority: 1000,
link:function(scope,element,attr){
var controllerProperty = scope[attr.ngDynamicController];
element.attr('ng-controller', controllerProperty);
element.removeAttr("ng-dynamic-controller");
$compile(element)(scope);
}
}
})
If you need more information why we have to add terminal: true
and priority: 1000
. Check out my answer to this question: Add directives from directive in AngularJS
You could try injecting it as a value:
angular.module('app', [])
.value('InnerCtrl',InnerCtrlAsLocalVariable)
.controller('OuterCtrl', ['$scope','InnerCtrl',
function($scope, InnerCtrl) { //inject the value into the function
$scope.dynamicCtrl = InnerCtrl;
}
])
Or use $injector to resolve dynamically:
var InnerCtrlAsLocalVariable = ['$scope',
function($scope) {
$scope.message = 'from controller defined in module - want';
}
]
angular.module('app', [])
.value('InnerCtrl',InnerCtrlAsLocalVariable)
.controller('OuterCtrl', ['$scope','$injector',
function($scope, $injector) { //inject the $injector service.
// resolve the value dynamically
$scope.dynamicCtrl = $injector.get('InnerCtrl');
}
])
.controller('InnerCtrlFromModule', InnerCtrlAsLocalVariable)
You can use $controller
service to create the controller instance dynamically, from that instance we can retrieve the constructor function using constructor
property
angular.module('app', [])
.controller('OuterCtrl', ['$scope','$controller',
function(scope, $controller) {
scope.dynamicCtrl = $controller('InnerCtrlFromModule',{$scope:scope.$new()}).constructor;
}
])
.controller('InnerCtrlFromModule',['$scope', function($scope) {
$scope.message = 'from controller defined in module - want';
}])
这篇关于从AngularJS控制器,我怎么解决这个模块(动态NG-控制器)中定义的另一个控制器的功能?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!