ts1109: angular expression expected error

Question

I make a simple form with angular using a reactive form but I have an error, i don't understand why it tells me that it lacks :

I've already had forms created many times but its the first time that I have this error.

ts.file

  productForm: any = FormGroup;

  constructor(private fb: FormBuilder,
    public dialogRef: MatDialogRef<DialogFormComponent>, 
    @Inject(MAT_DIALOG_DATA) public data:any) { }

  ngOnInit() {
    this.initDialogForm();
  }

  initDialogForm() {
    this.productForm = this.fb.group({
      id: [this.data?.id],
      name: [this.data?.name , Validators.required],
      price: [this.data?.price , Validators.required],
      comment: [this.data?.comment , Validators.required],
      date : [this.data?.date]
    });
  }

  onSubmit() {
    this.dialogRef.close(this.productForm.value);
  }

}

html

mat-dialog-content>
    <form [formGroup]="productForm" (ngSubmit)="onSubmit()">
        <div class="from-group">
            <label for="name">Nom</label>
            <input id="name" type="text" formControlName="name" class="form-control">
        </div>
        <div class="from-group">
            <label for="price">Prix</label>
            <input id="price" type="number" formControlName="price" class="form-control">
        </div>
        <div class="from-group">
            <label for="comment">Commentaire</label>
            <input id="comment" type="text" formControlName="comment" class="form-control">
        </div>
        <div class="from-group">
            <label for="expiration">date de péremption</label>
            <input id="expiration" type="date" formControlName="date" class="form-control">
        </div>
        <mat-dialog-actions>
            <button>Valider</button>
        </mat-dialog-actions>
    </form>
</mat-dialog-content>

Zahidur Rahman · Accepted Answer · 2021-06-14 08:49:06Z

1

? means conditional operataor inside formgroup thats whys compilar think that you have missing condition after :

   this.productForm = this.fb.group({
      id: [this.data.id],
      name: [this.data.name , [Validators.required]],
      price: [this.data.price , [Validators.required]],
      comment: [this.data.comment , [Validators.required]],
      date : [this.data.date]
    });

answered Jun 14, 2021 at 8:49

Zahidur Rahman

1,7282 gold badges20 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

ts1109: angular expression expected error

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related