Question

我有一个html页面，里面有一个指令（子html），如下所示。我想对父html中的按钮的指令（子html）中的input1和input2进行输入验证，但我不知道如何访问child（directive）中的input1和input2。我想知道访问input1和input2的正确方法是什么？在此先感谢!!

父html：

<div>

<child></child>
<button name="myButton" ng-disabled="????.myForm.input1.$invalid"><button>

</div>

指令：孩子

<form name="myForm">

<input name="input1" required/>
<input name="input2" required/>

</form>

Answer 1

试试这个：

家长控制器：

vm.myForm = {};

家长Html：

<child my-form="vm.myForm"></child>
<button name="myButton" ng-disabled="vm.myForm.input1.$invalid"><button>

儿童指令：

scope: {
myForm: "="
}

儿童HTML：

<form name="myForm">

    <input name="input1" required/>
    <input name="input2" required/>

</form>

Answer 2

您可以$emit向您的父控制器发送事件并传递所需的数据。

<强>指令：

$scope.$emit('yourCustomEvent', 'Data to send');

在你的父控制器中捕捉事件。

家长控制器：

$scope.$on('yourCustomEvent', function (event, data) {
  console.log(data); // will print "Data to send"
});

在您的情况下，我建议您在指令中包含该按钮，使用它会更容易。

如何访问指令中的元素？

2 个答案: