在混合应用程序中用角度5形式替换ng-form

时间:2018-05-02 21:31:31

标签: angularjs angular

我有一个带有HTML的AngularJS应用程序,如下所示。

<form name="completeForm">
  <first-step></first-step>
  <second-step></second-step>
  <third-step></third-step>
  <fourth-step></fourth-step>
  <fifth-step></fifth-step>
</form>

通过按钮点击事件验证当前步骤后,表格将继续下一步。

每个步骤指令HTML都是通过ng-form标记实现的,如下所示。

<first-step></first-step> => <ng-form name="firstForm"></ng-form>
<second-step></second-step> => <ng-form name="secondForm"></ng-form>
<third-step></third-step> => <ng-form name="thirdForm"></ng-form>
<fourth-step></fourth-step> => <ng-form name="fourthForm"></ng-form>
<fifth-step></fifth-step> => <ng-form name="fifthForm"></ng-form>

我想用一个使用Angular 5的实现替换其中一个步骤(第二步),从而使它成为混合应用程序。

我应该可以替换Angular 5中的第二步。与之相关的HTML如下所示。

<form  #secondForm="ngForm">
.....
  <input type="text"  #email="ngModel" name="email"  [(ngModel)]="$scope.email" required />
  <span *ngIf="!email.valid">please enter the input</span> 
...
</form>

但是我在Angular 5步骤中实现的验证不起作用。它正在进入下一步而没有验证 按钮单击事件。表格始终有效。 表单控制器无法识别定义为的secondForm <form #secondForm="ngForm">

我尝试用div标签替换表单标签(在父级别的表单中不能有其他表单),但是没有任何影响。

<div ngForm #secondForm="ngForm">

请有人帮忙。

0 个答案:

没有答案