angular 8 form example(html and ts file)

angular 8 form example

html file

<div style="padding: 10px;width: 500px;">
  <form [formGroup]="contactForm" (ngSubmit)="onSubmit()">
    <div class="form-group">
      <label for="address">Adres</label>
      <textarea style="height: 120px;resize: none;" class="form-control" formControlName="address"
                id="address" aria-describedby="address" placeholder="Adres girin"></textarea>
    </div>
    <div class="form-group">
      <label for="tel">Telefon</label>
      <input type="text" class="form-control" id="tel" placeholder="Telefon" formControlName="tel">
    </div>
    <div class="form-group">
      <label for="fax">Faks</label>
      <input type="text" class="form-control" id="fax" placeholder="Faks" formControlName="faks">
    </div>
    <div class="form-group">
      <label for="email">Email</label>
      <input type="text" class="form-control" id="email" placeholder="Email" formControlName="email">
    </div>

    <button type="submit" class="btn btn-primary" [disabled]="!contactForm.valid">Kaydet</button>
  </form>
</div>


ts file

export class ContactComponent implements OnInit {

  contactForm = this.formBuilder.group({
    address : ['', Validators.maxLength(500)],
    tel:      ['', Validators.pattern('^[0-9]*$')],
    faks:     ['', Validators.pattern('^[0-9]*$')],
    email:    ['', Validators.email]
  });
  constructor(private formBuilder: FormBuilder) { }

  ngOnInit() {
    // get values from web service
  }

  onSubmit() {
    // call save web service
  }

}