Question

我刚开始在Ionic 2（Angular 2）项目中使用ng2翻译。我发现当我需要同时获得一些字符串时，代码会嵌套并且更难以阅读。我有点想知道为什么这样的东西（只发出一个值）需要使用一个observable，但也许有一个很好的理由。总之...

例如，假设我在方法的各个点读取了4个字符串

let result1: string;
let result2: string;
let result3: string;
let result4: string;

this.translate.get("key1").subscribe(value1 => {
    result1 = value1;
    this.translate.get("key2").subscribe(value2 => {
        result2 = value2;

        // do some other stuff, which may have another observable returned so yet another level of nesting)

        this.translate.get("key3").subscribe(value3 => {
            result3 = value3;

            // do some other stuff

            this.translate.get("key4").subscribe(value4 => {
                result4 = value4;
            }
        }
        ...

现在想象有超过4个字符串。此外，当其中有其他代码时（例如我也可以调用也返回Observable的Ionic存储），代码变得非常嵌套 - 而且没有错误处理。

所以，问题是：是否有一个更平坦的＆＃34;这样做的方法？是否存在任何链接（即使类似于Promise＆＃34;链接），可能包括错误处理（即使存在某种顶级捕获块）

我已经看到了链接的其他例子，但它们似乎对运算符做了更多，而不是像上面这样的很多可观察对象。

Answer 1

You don't have to chain them; you can use combineLatest在单个页面上显示/隐藏元素，以组合观察点：

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/combineLatest';

Observable.combineLatest(
    this.translate.get("key1"),
    this.translate.get("key2"),
    this.translate.get("key3"),
    this.translate.get("key4")
)
.subscribe(([result1, result2, result3, result4]) => {
    console.log(result1);
    console.log(result2);
    console.log(result3);
    console.log(result4);
});

Answer 2

如果您事先知道所有键值，则可以使用带有字符串数组的translate.get()重载...

因此：

this.translate.get(['key1','key2','key3','key4'])
    .subscribe(keys => {
        console.log(keys.key1);
        console.log(keys.key2);
        console.log(keys.key3);
        console.log(keys.key4);
});

如何将调用链接到ng2-Translate和rxjs observables？

2 个答案: