【问题标题】:What's the Reactive way to collapse elements into an array?将元素折叠成数组的反应式方法是什么?
【发布时间】:2015-12-19 20:42:52
【问题描述】:

采用以下 TypeScript/Angular 2 代码示例:

query(): Rx.Observable<any> {

    return Observable.create((o) => {

        var refinedPosts = new Array<RefinedPost>();

        var observable = this.server.get('http://localhost/rawData.json').toRx().concatMap(
        result => 
            result.json().posts

        )
        .map((post: any) => {

            // Assume I want to convert the raw JSON data into a nice class object with 
            // methods, etc.
            var refinedPost = new RefinedPost();    
            refinedPost.Message = post.Message.toLowerCase();


            refinedPosts.push(refinedPost);
        })
        .subscribeOnCompleted(() => {
            o.onNext(refinedPosts);
        })


    });

}

写出来,数据库正在返回 JSON。我想遍历原始 JSON 并创建一个自定义对象,最终向订阅者返回 Array&lt;RefinedPost&gt;。

代码有效,最终订阅者得到了他们需要的东西,但我不禁觉得我没有按照“反应式方式”做。我作弊并使用了外部累加器来收集 Array 中的元素,这似乎违背了使用流的目的。

那么,问题是,有没有更好、更简洁、反应式的方式来编写这段代码?

【问题讨论】:

    标签: json angularjs typescript reactive-programming rxjs


    【解决方案1】:

    回答我自己的问题。

    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。 toArray() 获取项目序列并将它们组合成一个数组。

    【讨论】:

    • toArray 仅适用于已结束的收集。但是如果你想实时获取值数组,你可以使用scan 操作符。
    • 您也可以将map 中的函数作为第二个参数传递给concatMap。您只需将函数签名更改为(result, post) =&gt; {}。它将为来自result.json().posts的每个展开的项目调用
    猜你喜欢
    • 2015-10-18
    • 1970-01-01
    • 2019-10-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-02-23
    • 2021-03-27
    • 2018-05-02
    相关资源
    最近更新 更多