How to generate a form in angular without page refresh?

I have an angular 16 app and I need to generate a form after getting some fields from the api (backend). I need to generate the form without refreshing the page.

 addPropertyForm: FormGroup;

 CreateAddPropertyForm() {

this.addPropertyForm = this.fb.group({

  BasicInfo: this.fb.group({
    ProjectName: [null, Validators.required],
    SellRent: ['1' , Validators.required],
    BHK: [null, Validators.required],
    Bathroom: [null, Validators.required],
    PType: [null, Validators.required],
    FType: [null, Validators.required],
    Name: [null, Validators. Required],
    City: [null, Validators. Required]
  }),

get BasicInfo() {
        return this.addPropertyForm.controls['BasicInfo'] as FormGroup;
      }

 get PType() {
        return this.BasicInfo.controls['PType'] as FormControl;
      }

      get FType() {
        return this.BasicInfo.controls['FType'] as FormControl;
      }

      get City() {
        return this.BasicInfo.controls['City'] as FormControl;
      }

these fileds are taken from the api. How to generate the form without refreshing the page?

In production I didn’t face any issues…so no problems.