import { Component, OnInit } from '@angular/core'; import { FormControl, FormGroup, Validators } from '@angular/forms'; import { ActivatedRoute, Router } from '@angular/router'; import { Account } from 'src/app/model/account.model'; import { AccountService } from 'src/app/service/account.service'; @Component({ selector: 'app-edit-account', templateUrl: './edit-account.component.html', styleUrls: ['./edit-account.component.css'] }) export class EditAccountComponent implements OnInit { aid: any ; account: any; accountForm: FormGroup; constructor(private actRoute: ActivatedRoute,private route : Router, private accountService : AccountService) { this.accountForm = new FormGroup({ username : new FormControl(''), fullname: new FormControl(''), gender: new FormControl(''), phone: new FormControl(''), email: new FormControl(''), address: new FormControl(''), city: new FormControl(''), state: new FormControl(''), pincode: new FormControl(''), apartments: new FormControl('') }); } ngOnInit(): void { this.actRoute.paramMap.subscribe(params =>{ this.aid = params.get('aid'); }); this.accountService.getOneAccount(this.aid).subscribe(data=>{ this.account = data; this.accountForm = new FormGroup({ username : new FormControl(this.account.username,Validators.required), fullname: new FormControl(this.account.fullname,Validators.required), gender: new FormControl(this.account.gender,Validators.required), phone: new FormControl(this.account.phone,Validators.required), email: new FormControl(this.account.email,Validators.required), address: new FormControl(this.account.address,Validators.required), city: new FormControl(this.account.city,Validators.required), state: new FormControl(this.account.state,Validators.required), pincode: new FormControl(this.account.pincode,Validators.required), apartments: new FormControl(this.account.apartments,Validators.required) }); }); } OnAccountFormSubmit(){ let acc : Account = { id : +this.aid, username : this.accountForm.value.username, fullname : this.accountForm.value.fullname, gender : this.accountForm.value.gender, phone : this.accountForm.value.phone, email : this.accountForm.value.email, address : this.accountForm.value.address, city : this.accountForm.value.city, state : this.accountForm.value.state, pincode : this.accountForm.value.pincode, apartments : this.accountForm.value.apartments, } this.accountService.editAccount(this.aid,acc).subscribe(data=>{ this.route.navigateByUrl("/account/"+this.aid); }, (err: any) =>{ console.log(err); }); } }