在 observable 中添加延迟会在 Angular rxjs 中返回部分数据

Question

In my code I need to add delay by using timer(500) . But the issue is that it returns partial data. It is returning 2 fields while actual data has 17 fields. I have attached my code. please see it. Thank you

Returned value:

 ['booking_display_id', 'edit']

Expected value:

 ['booking_display_id', 'bookingstatus', 'b_contactname', 'member', 'b_emailaddress', 'b_mobilenumber', 'startdate', 'enddate', 'duration', 'bookingguest', 'guestnotes', 'vouchers', 'paypalpaymentpdt', 'totalCost', 'canPay', 'canCancel', 'edit']

 this.displayedColumns = combineLatest(this.table.columns.reduce((observables: Observable<boolean>[], col) => { // handle showIf property of column const show = col.showIf(this.injector, this.route.queryParamMap); observables.push(show instanceof Observable ? show : of(show)); return observables; }, []), timer(500)).pipe( map(showCols => { const cols = this.table.columns.filter((c, i) => showCols[i]) .map(c => c.id); this.editEnabled && cols.push('edit'); this.deleteEnabled && cols.push('delete'); console.log('cols', cols) return cols; }) );

Answer 1

You need to merge the delay event and your observable event.

let c = [
  'booking_display_id',
  'bookingstatus',
  'b_contactname',
  'member',
  'b_emailaddress',
  'b_mobilenumber',
  'startdate',
  'enddate',
  'duration',
  'bookingguest',
  'guestnotes',
  'vouchers',
  'paypalpaymentpdt',
  'totalCost',
  'canPay',
  'canCancel',
  'edit',
];

let bsObs: BehaviorSubject<String> = new BehaviorSubject<String>('');
let obs: Observable<String> = bsObs.asObservable();

obs
  .pipe(
    concatMap((x) => of(x).pipe(delay(500)))
  )
  .subscribe((s) => console.log(s));

c.forEach((c) => bsObs.next(c));