Как сохранить данные формы заполненными, даже если я вернусь на предыдущую страницу?

Question

Предположим, у меня есть форма, которая содержит несколько полей, названных как:

Name, Id ,Address and MobileNo.

После заполнения всех деталей, пользователь перемещается на следующую страницу.

После этого, если я нажму кнопку «Назад» и перейду на предыдущую страницу, я хочу, чтобы те данные были уже заполнены, которые я заполнил в прошлый раз.

Как я могу сделать это с Angular JS?

Answer 1

Вы можете сохранить значение формы в веб-хранилище или с помощью службы .Вам нужно получить значение формы на хуке жизненного цикла уничтожения компонента и отправить его в службу или сохранить в хранилище.

Service.ts

@Injectable()
export class CacheService {

  private formData: any;

  constructor() { }

  public setFormData(formData: any): void {
    this.formData = formData;
  }

  public getFormData(): any {
    return this.formData;  
  }

}

Component.ts

@Component({
  selector: 'app-test',
  templateUrl: './template.html',
  styleUrls: ['./styles.scss']
})
export class TestComponent implements OnInit, OnDestroy {

  public form: FormGroup;

  constructor(private cacheService: CacheService) {
  }

  ngOnInit() {
    this.form.patchValue({
      this.cacheService.getFormData();
    });
  }

  public ngOnDestroy(): void {
    this.cacheService.setFormData(this.form.value);
  }
}