普朗克可用
这里
我想在角度材料 md 对话框中包含一个指令(示例中的第一个指令)和必需的^form
。显示对话框时,出现错误,指出找不到表单:
[$compile:ctreq] Controller 'form', required by directive 'first', can't be found!
我正在使用require:^form
因为我想ng-messages
指令内父表单的某些字段进行验证。对话框外的指令按预期工作,表单输入已正确验证,仅当我在对话框中使用指令时,才会出现问题。
我尝试包含另一个指令(示例中的第二个指令),没有require:^form
,并且它在对话框中正确显示,但在这种情况下无法验证输入。
我的问题是:当表单在对话框之外定义时,有没有办法在 md-dialog 中使用带有"需要表单"的指令?
我想这是因为 mdDialog 正在创建自己的范围......我已经尝试通过当前范围,创建一个新范围等,但到目前为止没有成功。
该问题可以很容易地在附加的 plunker 中重现。
相关参考来源:
function first() {
var directive = {
restrict: 'EA',
scope: {
param: '@'
},
require: '^form',
bindToController: true,
template: '<md-input-container class="md-block"><label>Street with validation</label><input name="street" ng-model="vm.street" required><div ng-messages="form.street.$error"><div ng-message="required">Required</div></div></md-input-container>',
controller: FirstController,
controllerAs: 'first',
link: function(scope, element, attrs, form) {
scope.form = form;
}
};
FirstController.$inject = [];
function FirstController() {
var first = this;
}
return directive;
}
function openDialogFail(event) {
$mdDialog.show({
template: '<md-dialog><md-dialog-content><first/></md-dialog-content></md-dialog>',
targetEvent: event,
controller: () => this //,
// scope: $scope.$new()
});
}
提前感谢您的帮助!
摘自注释:
我仍然没有得到用例,但是是否有某些事情阻止您将
<first />
包装在单独的<form>
中,例如在 codepen.io/z00bs/pen/vGaBgm