切换 TAB 时未调用 statusChanges答案

【问题标题】：statusChanges not called when switch TAB切换 TAB 时未调用 statusChanges
【发布时间】：2019-09-26 01:01:55
【问题描述】：

我有一个包含两个 TAB 的父组件。每个 TAB 包含一个子组件。每个子组件都有一个表单。

在父组件上有一个按钮。我想要的是一旦两个反应形式有效，然后启用按钮。父组件点赞

 <Button (click)="Submit()" [disabled]="!isChild1FormValid || !isChild2FormValid">Submit</Button>
 <kendo-tabstrip (tabSelect)="onTabSelect($event)">
    <kendo-tabstrip-tab [title]="'Paris'" [selected]="true">
      <ng-template kendoTabContent>
        <app-child1 (isChild1FormValid)="trigger1($event)">
        </app-child1>
      </ng-template>
    </kendo-tabstrip-tab>
    <kendo-tabstrip-tab [title]="'New York City'">
      <ng-template kendoTabContent>
         <app-child2 (isChild2FormValid)="trigger2($event)">
        </app-child2>
      </ng-template>
    </kendo-tabstrip-tab>
 </kendo-tabstrip>

我父母的 ts 文件。我们有方法。

trigger1(isValid: boolean) {
   isChild1FormValid = isValid;
}
 trigger2(isValid: boolean) {
   isChild2FormValid = isValid;
}

在 child1 组件中。

@Output() isChild1FormValid: EventEmitter<boolean> = new EventEmitter<boolean>();
In its `ngOnInit()`, we have 
     childForm1.statusChanges.subscribe(res => {
      if(res == 'VALID') {
          this.isChild1FormValid.emit(true);
       }
       });
   }

在 child2 组件中类似，

@Output() isChild2FormValid: EventEmitter<boolean> = new EventEmitter<boolean>();
In its `ngOnInit()`, we have 
    childForm2.statusChanges.subscribe(res => {
      if(res == 'VALID') {
          this.isChild2FormValid.emit(true);
       }
       });
    }

假设 child1 表单和 child2 表单有一些文本框，这是必需的。（这里省略代码，因为它只是 Validators.required。

现在我在控件中输入了一些文本并在 statusChanges 事件中设置断点。现在的问题是 child2 statusChanges 方法没有被调用。但是 child1 没问题，验证确实有效。我猜那是我切换时TAB的问题，它可能会重新加载？？？

更新：

不确定为什么它在 stackblitz 中有效但在我的应用程序中失败。

【问题讨论】：

那么你是在孩子 1 的文本框中输入内容吗？
两者，我输入 child1，statusChanges 被调用。然后我切换到child 2，对应的statusCahnges没有被调用。
你能添加一个 stackblitz 工作 url 吗？

标签： javascript angular

【解决方案1】：

原来是低级错误，我没有将表单控件的名称放在元素中。我应该仔细检查一下。

如

<label>
First Name:
<input type="text" formControlName="firstName">

【讨论】：