我可以将NgModelController传递给指令控制器吗?这是必需的,因此我可以为控制器中的模型分配值。
此示例不起作用:
angular
.module('directives.selectBox', [])
.directive('selectBox', selectBox);
function selectBox() {
return {
restrict : 'E',
require : 'ngModel',
scope : {
list : '=',
},
replace : true,
templateUrl : 'common/directives/selectBox/selectBox.html',
controller : SelectBoxController,
};
}
function SelectBoxController(ngModel) {
ngModel.$setViewValue(10); // ???
}
最佳答案
实际上非常简单,您需要做的是通过将$element
注入到控制器中,然后在其上调用.controller()
函数来访问元素。
angular
.module('directives.selectBox', [])
.directive('selectBox', selectBox);
function selectBox() {
return {
restrict : 'E',
require : 'ngModel',
scope : {
list : '=',
},
replace : true,
templateUrl : 'common/directives/selectBox/selectBox.html',
controller : SelectBoxController,
};
}
function SelectBoxController($element) {
var ngModel = $element.controller('ngModel');
ngModel.$setViewValue(10); // ???
}
Angular 1.5更新
请注意,在AngularJS 1.5中,除了现有的
component()
函数之外,还添加了新的directive()
函数。此函数将configuratoin对象作为第二个参数,该参数允许您直接指定所需的控制器,然后将其绑定到组件的控制器。再次在同一示例下,但作为组件。
angular
.module('directives.selectBox', [])
.component('selectBox',
{
controller: SelectBoxController,
controllerAs: 'vm',
templateUrl : 'common/directives/selectBox/selectBox.html',
bindings: {
list: '=' // though '<' would be better
},
require: {
ngModel: '='
},
// replace: true ==> No longer possible with component
}
);
function SelectBoxController($element) {
$onInit() {
// This function is called automatically whenever the controller is ready
this.ngModel.$setViewValue(10); // ???
}
}
我希望我可以输入正确的代码,这个很小的textarea几乎不是IDE的:)