Question

我有一个Angular 2应用程序，其中我有一个包含树子组件的主组件。

在我的一个子组件中（我们称之为user_input）我有一个带有用户输入的表单。在我的主组件中，我有一个按钮，需要检查我的子组件形式是否有效，从而启用它。

我试图通过它访问它。（来自master.view.html）

<user_input #usrInput></user_input><button                           

[disabled]="!usrInput.formname.form.valid(click)="next()">
Next</button>

但是由于我的user_input表单在我验证我的主人时没有初始化，因此抛出了“类型未知”的异常。

有解决这个问题的聪明方法吗？我有一个由两人共享的服务，但我不想用它。

提前致谢！

[UPDATE]

我在ngSwitch中有我的子元素。

  <div *ngSwitchCase="0">
    <create-user-info></create-user-info>
  </div>

  <div *ngSwitchCase="1">
    <create-user-services></create-user-services>
  </div>

  <div class="col-lg-12" *ngSwitchCase="2">
    <create-user-conditions></create-user-conditions>
  </div>

</div>

一旦我把它移出它，错误就解决了。由于我需要它在ngSwitch中，我使用了下面提供的解决方案

Answer 1

您可以利用所谓的safe navigation operator。这样，只有usrInput不再为空时才会评估以下成员。

<user_input #usrInput></user_input>
<button [disabled]="!usrInput?.formname.form.valid"
        (click)="next()">Next</button>

访问子组件的形式以进行验证

1 个答案: