我正在使用Angular Formly库来生成表单。该库允许您使用JSON对象构建表单。我正在开发一个动态的父子下拉列表:
http://jsbin.com/fiqubibawi/edit?js,output
vm.formFields
数组包含几个描述应如何构建输入字段的对象。这些对象中的每一个都包含一个controller
对象。这正是它听起来的样子:Angular控制器。这是一个示例对象:
{
key: 'sport',
type: 'select',
templateOptions: {
label: 'Sport',
options: [],
valueProp: 'id',
labelProp: 'name',
},
controller: /* @ngInject */ function($scope, DataService) {
$scope.to.loading = DataService.sports().then(function(response){
$scope.to.options = response;
return response;
});
}
}
我的问题:我生成这些对象服务器端(ASP.NET),并使用JSON将它们发送到浏览器。这意味着我无法将控制器功能添加到此对象。我宁愿拥有的东西:
{
key: 'sport',
type: 'select',
templateOptions: {
label: 'Sport',
options: [],
valueProp: 'id',
labelProp: 'name',
},
controller: ['MyCoolController']
}
}
Angular有什么方法,或者其他一些脏的黑客攻击,让这段代码有效吗?它是一个字符串,因为JSON规范不允许通过线路发送函数。
答案 0 :(得分:2)
幸运的是,你可以使用Angular的依赖注入。
只需声明一个新控制器
app.controller('TestController', function($scope, DataService) {
$scope.to.loading = DataService.sports().then(function(response){
$scope.to.options = response;
return response;
});
});
然后您可以使用名称'TestController'
注入(我已更新您的jsbin以反映此情况)
vm.formFields = [{
key: 'sport',
type: 'select',
templateOptions: {
label: 'Sport',
options: [],
valueProp: 'id',
labelProp: 'name',
},
controller: 'TestController'
},
...
];