Form Group Validation

Question

Hi,

I will use form group validation. But doing so " Property 'last Names' does not exist on type 'AddEditUsersComponent'." I get an error.

How can i solve this.

import { Component, OnInit,Input } from '@angular/core';
import { SharedService } from 'src/app/shared.service';
import { FormControl, FormGroup, Validators } from '@angular/forms';


@Component({
  selector: 'app-add-edit-users',
  templateUrl: './add-edit-users.component.html',
  styleUrls: ['./add-edit-users.component.sass'],
  providers:[SharedService,Kisiler]
})
export class AddEditUsersComponent implements OnInit {

  constructor(private service:SharedService) { }

  kisiForm=new FormGroup({
    CustomerCode:new FormControl('',[Validators.required]),
    email:new FormControl(''),
    Password:new FormControl(''),
    firstName:new FormControl(''),
    lastName:new FormControl('')
  });

  ngOnInit(): void {
  }

  SaveKisi(){


  this.service.addUser(this.kisiForm.value).subscribe(res=>{
    alert("Kaydedildi");
    alert(JSON.stringify(res));
    var tok = res.token;
    var toks = res.expiration;

    alert(toks);

  });
}

}

<app-header></app-header>
<div class="container">

 

  <div class="card card-primary" style="margin-top: 100px;">
    <div class="card-header">
      <h3 class="card-title">Kullanici Ekle</h3>
    </div>

    <form [formGroup]="kisiForm" (ngSubmit)="SaveKisi()"  >
      <div class="card-body">

     
        <div class="form-group">
    <label for="exampleInputEmail1">Customer Code</label>
          
<input type="email" class="form-control" formControlName="cust" placeholder="CustomerCode">
      
<span class="error" style="color: red; font-weight: bold;" *ngIf="cust && cust.invalid && cust.touched">Zorunlu</span>
     
        </div>

        <div class="form-group">
<label for="exampleInputEmail1">Email address</label>


<input type="email" class="form-control" formControlName="emails"  placeholder="Email">
    <span class="error" style="color: red; font-weight: bold;" *ngIf="emails && emails.invalid && emails.touched">Zorunlu</span>

    
        </div>

        <div class="form-group">
          <label for="exampleInputPassword1">Password</label>
       

          <input type="password"  class="form-control" formControlName="passwords" placeholder="Password">

          <span class="error" style="color: red; font-weight: bold;" *ngIf="passwords && passwords.invalid && passwords.touched">Zorunlu</span>
        </div>       

        <div class="form-group">
          <label for="exampleInputEmail1">First Name</label>
          <input type="text"  class="form-control" formControlName="firstNames" placeholder="First Name">
          <span class="error" style="color: red; font-weight: bold;" *ngIf="firstNames && firstNames.invalid && firstNames.touched">Zorunlu</span>
        </div>


        <div class="form-group">
          <label for="exampleInputEmail1">Last Name</label>

          <input type="email"  class="form-control" formControlName="lastNames" placeholder="Last Name">

          <span class="error" style="color: red; font-weight: bold;" *ngIf="lastNames && lastNames.invalid && lastNames.touched">Zorunlu</span>
        </div>

      </div>   

      <div class="card-footer">
        <button type="submit"  class="btn btn-primary float-right">Register
        
        </button>

       
      </div>
    </form>
  </div>


</div>

  
<app-footer></app-footer>