Question

当我将其拉下时，我必须创建一个“拉动刷新”功能，该功能将永远旋转，并且数据也不会传入。我使用switchMap并在数据响应时点击loadComplete $，但它没有点击。我可以返回任何可观测值吗？。

export class FriendListComponent  implements OnInit {
  defaultPhoto = `https://www.freeiconspng.com/uploads/no-image-icon-4.png`;
  updateUsersTrigger$ = this.loadNotifyService.requestLoad$;
  users: any = this.updateUsersTrigger$.pipe(
    switchMap(() => {
      return this.friendListService.getData();
    }),
    tap(this.loadNotifyService.loadComplete$)
  );
  constructor(
    private db: AngularFirestore,
    private friendListService: FriendListService,
    private loadNotifyService: LoadNotifyService
  ) {}
  ngOnInit() {
    this.friendListService.getData().subscribe(data => {
      this.users = data;
    });
  }
}

在firebase.services

@Injectable()
export class FriendListService {
  data$: BehaviorSubject<Array<any>> = new BehaviorSubject([]);}
  constructor(private db: AngularFirestore) {
    const data = ...query from Firestore
    this.data$.next(data)
  }
  getData() {
    return this.data$.asObservable();
  }
}

在LoadNotifyService中

@Injectable()
export class LoadNotifyService {
  requestLoad$ = new Subject<any>();
  loadComplete$ = new Subject<any>();
}

Answer 1

好的，我的错误是HTML中的异步管道遗忘。

<mat-sidenav-content>
  <mat-card>
    <mat-list>
      <mat-list-item *ngFor="let user of **(users | async)**">
        <img mat-list-avatar [src]="(user.user | async)?.photoUrl || defaultPhoto ">
        <h3 mat-line>{{(user.user | async)?.displayName || "ใครก็ไม่รู้ค่ะ"}}</h3>
        <p mat-line>{{user?.updated | amLocale:'th' | amTimeAgo}}</p>
        <p mat-line>
          <span>{{user.msg | async}}</span>
        </p>
      </mat-list-item>
    </mat-list>
  </mat-card>
</mat-sidenav-content>

因为

users: any = this.updateUsersTrigger$.pipe(
    switchMap(() => {
      return this.friendListService.getData();
    }),
    tap(this.loadNotifyService.loadComplete$)
  );

那会返回一个Observable，我忘了一个异步管道上的水龙头未解析。

如何实现switchMap（rxjs）和tap（rxjs）进行近距离刷新以进行刷新

1 个答案: