prolina @prolina

Показывать спиннер, только если нет ответа от сервера более 3-х секунд?

Использую компонент таблицы из ангуляр материал, таблицу заполняю данными, полученными от бэкенда. необходимо показывать спиннер в том случае, если ответа от бэкенда нет более 3-х секунд, сейчас спиннер показывается, когда ответа его еще нет, а как только получен - спиннер убираем (this.isLoadingResults = false;)

public ngAfterViewInit(): void {
		this.keywordsDatabase = new KeywordsDatabase(this.keywordService);
		// If the user changes the sort order, reset back to the first page.
		this.sort.sortChange.subscribe(() => this.paginator.pageIndex = 0);
		this.keywordService.keywordGroupFilterObserver$.subscribe(res => this.filterValue = res);
		merge(
			this.sort.sortChange,
			this.paginator.page,
			this.keywordService.keywordGroupFilterSubject,
			this.keywordService.editKeywordObserver,
		)
			.pipe(
				startWith({}),
				switchMap(() => {
					this.isLoadingResults = true;
					return this.keywordsDatabase.getKeywordsList({
						groupType: KeywordGroupTypeNumber[KeywordGroupTypeString[this.filterValue]],
						sortBy: this.sort.active,
						sortDirection: this.mapEnumStringToNumber(this.sort.direction),
						skip: this.paginator.pageIndex,
					});
				}),
				map(data => {
					// Flip flag to show that loading has finished.
					this.isLoadingResults = false;
					this.isRateLimitReached = false;
					this.isDataTable = false;
					this.resultsLength = data.count;

					return data.items.map(keyword => {
						return {
							text: keyword.text,
							amount: keyword.amount,
							groupType: KeywordGroupTypeString[KeywordGroupTypeNumber[keyword.groupType]] || '',
							type: KeywordTypeString[KeywordTypeNumber[keyword.type]],
							id: keyword.id,
						};
					});
				}),
				catchError(() => {
					this.isLoadingResults = false;
					// Catch if the API has reached its rate limit. Return empty data.
					this.isRateLimitReached = true;
					return observableOf([]);
				}),
			).subscribe(data => {
				if (data.length) {
					this.data = data;
				} else {
					this.isDataTable = true;
					this.data = [];
				}
		});
	}

export class KeywordsDatabase {
	constructor(private keywordService: KeywordService) {
	}

	public getKeywordsList(
		sortParameters: KeywordSort,
	): Observable<KeywordCollectionModel> {
		return this.keywordService.getKeywordsList({
				groupType: sortParameters.groupType || '',
				sortBy: sortParameters.sortBy,
				sortDirection: sortParameters.sortDirection,
				skip: sortParameters.skip,
			},
		);
	}
}

this.isLoadingResults = false; отвечает за то, когда показывать спиннер