Question

我有一个TypeScript / Angular 2 Observable，第一次调用它时效果很好。但是，我有兴趣将多个订阅者附加到同一个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();

}

假设有一个刷新按钮，当按下该按钮时，重新执行此observable，并且连接到它的任何订阅者都会获得一组更新的数据。

我该如何做到这一点？

Answer 1

我不太了解Angular2和Typescript，但是打字稿是javascript的超集，我做了以下假设（让我知道，如果我错了），这应该使以下的javascript代码工作：

server.get返回一个promise（或数组或Rx.Observable）
posts是post

您需要从该按钮上的click事件创建一个observable，将该点击映射到您的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)})

一些解释：

每次单击都会产生对server.get的调用，该调用返回一个可观察兼容的类型（数组，promise或observable）。返回的observable被展平以从该调用中提取result
因为用户可以多次点击，每次点击都会产生数据流，我们感兴趣（我在这里做的另一个假设）只在最新点击的结果中，我们使用运算符flatMapLatest，它将执行flatMap仅在最新点击生成的observable上
我们提取帖子posts的数组，并从中创建一个refinedPost数组。最后，每次点击都会产生一个refinedPost数组，我认为这是你想要的
我们分享此观察结果，因为您提到您将拥有多个订阅者，并且您希望所有订阅者都能看到相同的数据。

让我知道我的假设是否正确以及这是否适合你。

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

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

如何重启或刷新Observable？

1 个答案: