Необходимо отобразить новые добавленные записи/строки в Angular11 с помощью службы веб-api без обновления страницы

#angular11

Вопрос:

Компонент.ts

 ngOnInit() {
    this.employeeservice.getEmp_ServiceFun().subscribe(
      (data: Employee[]) => this.employees = data,
      error => this.error = error
    );
  }
 

сервис.ts

 constructor(private http: HttpClient) { }

  public getEmp_ServiceFun(): Observable<Employee[]> {

    return this.http.get<Employee[]>(this.serverUrl   'employees')
    .pipe(
      catchError(this.handleError)
      );
  }
 

Комментарии:

1. csharp-video-tutorials.blogspot.com/2017/08/…

Ответ №1:

мне кажется немного странным снова запускать метод ngoninit, так как он предназначен для запуска только один раз. Я бы завернул метод employeeservice в наблюдаемый интервал. однако не забудьте отписаться. в противном случае он будет продолжать вызывать функцию getEmp_ServiceFun до тех пор, пока все приложение не закроется

 ngOnInit() {
    interval(1000).pipe(
        map(() => {this.employeeservice.getEmp_ServiceFun().subscribe(
            (data: Employee[]) => this.employees = data,
            error => this.error = error
        );})}
 

однако это заменит весь массив, а не просто добавит к нему. Я бы еще раз взглянул на функцию getEmp_ServiceFun, чтобы вы могли запрашивать только новые данные, а не все данные, а затем помещать их в массив.

правка: еще лучше было бы не подписываться на карту, а переместить ее в после трубы. возможно, вам потребуется использовать карту переключения

Ответ №2:

Раньше я setTimeout() обновлял компонент, он работает нормально, но теперь мне просто нужно проверить, хорошая ли это практика или нет?

 ngOnInit() {
      this.employeeservice.getEmp_ServiceFun().subscribe(
        (data: Employee[]) => this.employees = data,
        error => this.error = error
      );
    //refresh this component
    this.timeout = setTimeout(() => { this.ngOnInit() }, 1000 * 1)
  }