Замена setTimeout () в угловой реактивной форме с наблюдаемой

Question

Я хочу заменить setTimout () на Observable в угловой реактивной форме.

У меня есть компонент внука, который обслуживает часть более крупной реактивной формы, получает массив объектов данных от APIконечная точка, упаковывает эти данные в массив форм и отправляет их в форму.Это хорошо работает.

Проблема заключается в том, что асинхронная природа наших конечных точек API заставляет данные формы этого внукового компонента отображать старые данные, прежде чем новые данные смогут инициализироваться, очистить старые данные и снова заполнить новые.данные.Мы решили это с помощью setTimout (), равной 500 мс.Он хорошо работает во внешнем интерфейсе.

Проблема в том, что setTimeout () вызывает проблемы с нашим тестом e2e, который не проходит, потому что он завершает тест до загрузки данных.Кроме того, тайм-аут не является долгосрочным решением этой асинхронной проблемы ... особенно, если данные могут иногда занимать больше 1/2 секунды (не обычный случай, но определенно правдоподобно).

Яв надежде заменить мой тайм-аут на наблюдаемое в качестве лучшего решения, которое не будет блокировать наши тесты и сможет более безопасно обрабатывать асинхронные операции.Проблема в том, что я не могу заставить наблюдаемое работать, и я все еще новичок в RxJS.

Вот исходная функция с текущим временем ожидания:

setTimeout(() => {
      this.dataRow = [];
      for (let item of this.data.row) {
        this.dataRow.push(item);
      }
    }, 500);

Вот мойпопытка воссоздания с помощью Observable:

this.dataRow = [];
   this.dataEmitter = from(this.data.row).pipe(delay(1000)).subscribe(data => this.dataRow.push(data);)

Мой код создает поток данных, но, похоже, не работает так же, как время ожидания.Как я могу сделать это?Это даже правильный способ решения этой проблемы?Любой совет приветствуется.

Answer 1

EDIT:

this.dataEmitter = of(this.data.row).pipe(delay(1000)).subscribe(row => {
  for (let item of row) {
    this.dataRow.push(item);
  }
}

---

delay(1000) задержки на 1 сек. за каждый выброс. И ваш фрагмент неверен - вы не можете push(row), потому что row равно undefined (как видно из фрагмента).

, поэтому, если this.data.row - Объект, вам нужно сделать его итеративным (например, массивом), если вы хотите испустить this.data.row в "мирах".

Но если вы просто хотите избавиться от setTimeout:

this.dataEmitter = from([this.data.row]).pipe(delay(1000)).subscribe(row => {
  for (let item of row) {
    this.dataRow.push(item);
  }
}

Answer 2

Ваш код будет выглядеть так:

this.dataRow = []

of(this.data.row)
 .pipe(delay(500))
 .subscribe(data => {
   for(let item of data) {
     this.dataRow.push(item);
   }
 })