首页 > 解决方案 > 显示错误 TypeError: this.form._updateTreeValidity is not a function 的 mat-checkbox

问题描述

我在一个角度应用程序上工作。在一个组件中,我有以下代码

export class GlobalComponent {
  @Input()
  form!: FormGroup<DeepRequired<GlobalBean>>

使用以下模板提取

..................
<mode-impression-ticket [form]="form" [labelCheckBox]="text" ></mode-impression-ticket>
...................

这是以下模式印象票组件

@Component({
  selector: "mode-impression-ticket",
.............
export class LocalComponent implements OnInit {

  @Input()
  form!: FormGroup<DeepRequired<GlobalBean>>

  localForm: FormGroup<DeepRequired<GlobalBean>> | undefined;



@Input()
  labelCheckBox!: string

  ngOnInit() {
    this.localForm = Object.assign({}, this.form);
    console.log(this.localForm);
    console.log(this.localForm.controls['flag']?.value);
    console.log(this.labelCheckBox);

前一个组件的目标是获取具有相同表单的字段的值,然后将其转发给其父级 上面的 console.log 没有给出任何错误并打印值

使用以下模板提取

@Component({
  selector: "mode-impression-ticket",
  template: `
    <form [formGroup]="localForm">
    <mat-checkbox  formControlName="flag">{{labelCheckBox}}</mat-checkbox>
.........................................

并且在 <mat-checkbox formControlName...行有一个错误......

TypeError: this.form._updateTreeValidity is not a function

更新

this.form 在上面的两个组件中初始化(在下面的方法中的祖父组件)。子组件、父组件和祖父组件具有相同的形式

  ngOnInit() {
    this.form = VtForm.build(this._route,
      FormHelpers.getInitData(this._route),
    )
  }

标签: angulartypescriptangular-material

解决方案


我也忘了告诉你我使用@ng-stack/forms

最后我使用与父级相同的表单并且不重复它

export class LocalComponent {


  @Input()
  formGroup!: FormGroup<Required<VtParamTermIhmBean>>

此外,我更改了模板(参见以下帖子:reactiveform that doesn't compile),一切都井井有条。讨论结束。谢谢


推荐阅读