如何重新启动或刷新可观察量

How to restart or refresh an Observable?

本文关键字:观察 刷新 重新启动      更新时间:2023-09-26

我有一个TypeScript/Angular 2 Observable,在我第一次调用它时可以完美运行。但是,我有兴趣将多个订阅者附加到同一个可观察量,并以某种方式刷新可观察量和附加的订阅者。这是我得到的:

query(): Rx.Observable<any> {
return this.server.get('http://localhost/rawData.json').toRx().concatMap(
    result =>
        result.json().posts
    )
    .map((post: any) => {
        var refinedPost = new RefinedPost();
        refinedPost.Message = post.Message.toLowerCase();
        return refinedPost;
    }).toArray();
}

想象一下,有一个刷新按钮,当按下该按钮时,会重新执行此可观察量,并且连接到它的任何订阅者都会获得一组更新的数据。

我怎样才能做到这一点?

我对 Angular2 和 Typescript 了解不多,但打字稿是 javascript 的超集,我提出了以下假设(如果我错了,请告诉我(,这应该使以下 javascript 代码工作:

  • server.get返回一个承诺(或数组或 Rx.Observable(
  • posts是一系列post

您需要从该按钮上的单击事件创建一个可观察量,将该单击映射到您的GET请求,其余的应该或多或少与您编写的那样。我无法测试它,但它应该遵循以下思路:

// get the DOM id for the button
var button = document.getElementById('#xxx');
// create the observable of refined posts
var query$ = 
    Rx.Observable.fromEvent(button, 'click')
        .flapMapLatest(function (ev) {
                     return this.server.get('http://localhost/rawData.json')
                   })
        .map(function (result){return result.json().posts})
        .map(function (posts) {
                return posts.map(function(post){
                                   var refinedPost = new RefinedPost();
                                   refinedPost.Message = post.Message.toLowerCase();
                                   return refinedPost;
                           })
             })
        .share()
// subscribe to the query$. Its output is an array of refinedPost
// All subscriptions will see the same data (hot source)
var subscriber = query$.subscribe(function(refinedPosts){console.log(refinedPosts)})

一些解释:

  1. 每次点击都会产生对server.get的调用,该调用返回可观察兼容的类型(数组、承诺或可观察(。返回的可观察量被展平,以从该调用中提取result
  2. 因为用户可以多次点击,并且每次点击都会产生其数据流,并且我们只对最近点击的结果感兴趣(我在这里也提出了另一个假设(,所以我们使用运算符flatMapLatest,它将只对最近点击生成的可观察量执行flatMap。
  3. 我们提取后posts数组并从中制作一个refinedPost数组。最后,每次点击都会产生一系列refinedPost我认为这就是您想要的
  4. 当您提到您将有多个订阅者并且您希望所有订阅者看到相同的数据时,我们共享此可观察性。

让我知道我的假设是否正确,以及这是否对您有用。

此外,我建议您看看 https://gist.github.com/staltz/868e7e9bc2a7b8c1f754

除了很好地提醒这些概念之外,它还解决了与您的非常相似的刷新服务器调用问题。