Как связать вызовы ng2-Translate и наблюдаемых в rxjs вообще?

Question

Я только начал использовать перевод ng2 в своем проекте Ionic 2 (Angular 2). Я обнаружил, что когда мне нужно получить несколько строк одновременно, код становится вложенным и становится намного сложнее для чтения. Я как бы удивляюсь, почему что-то подобное (которое просто испускает одно значение) должно использовать наблюдаемое, но, возможно, есть веская причина. Тем не мение...

Так, например, скажем, у меня было 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 строк. Также, когда между ними есть другой код (например, я могу также вызвать хранилище Ionic, которое также возвращает Observable), код становится очень вложенным - и это без обработки ошибок.

Итак, вопрос: есть ли "более плоский" способ сделать это? Есть ли какие-либо цепочки (даже если они похожи на Promise? Цепочки), возможно, включая обработку ошибок (даже если был какой-то блок catch верхнего уровня)

Я видел другой пример создания цепочек, но они, похоже, делают больше с операторами, а не с множеством наблюдаемых, как выше.

Answer 1

Вам не нужно их связывать; ты можешь использовать 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);
});