2つ（またはそれ以上）の@ ngrx / storeアクションをキャッチし、それが発生するまでコンポーネントでサブスクリプションを保持するにはどうすればよいですか？

これを行うには2つの方法が考えられます（他の方法があると確信しています）。

1.レデューサー内

してみましょうinitReducerに設定する準備ができて、フラグのために成功するために持っている各要求のフラグ持っ-Statetrueの両方の* _DATA_SUCCESSアクションを減らすことをinitReducer：

init.reducer.ts

export interface InitState = {
    characterSuccess: boolean,
    vehicleSuccess: boolean,
    ready: boolean
}

const initialState = {
    characterSuccess = false,
    vehicleSuccess = false,
    ready = false
};

export const initReducer (state: InitState = initialState, action: Action): InitState {
    switch (action.type) {
        /* ...
         * other cases, like INITIALIZING or INITIALIZING_ERROR...
         */

        case CharacterActions.CHARACTER_DATA_SUCCESS: {
            /* set characterSuccess to true.
             *
             * if vehicleSuccess is already true
             * this means that both requests completed successfully
             * otherwise ready will stay false until the second request completes
             */
            return Object.assign({}, state, {
                characterSuccess: true
                ready: state.vehicleSuccess
            });
        }

        case VehicleActions.VEHICLE_DATA_SUCCESS: {
            /* set vehicleSuccess to true.
             *
             * if characterSuccess is already true
             * this means that both requests completed successfully
             * otherwise ready will stay false until the second request completes
             */
            return Object.assign({}, state, {
                vehicleSuccess: true,
                ready: state.characterSuccess
            });
        }

        default:
            return state;
    }
}

2.セレクターを使用する

initReducer現在初期化しているかどうかを追跡するためだけに作成した場合は、レデューサー全体を省略して、代わりに派生状態を計算するセレクターを使用できます。再選択ライブラリ
を使用するのが好きです。変更が発生したときにのみ再計算する効率的なセレクター（=メモ化されたセレクター）を作成できるからです。

まず、Vehicles-reducerとCharacters-reducerの両方の状態形状にloading-readyフラグと-フラグを追加します。
次に、レデューサーレベルでセレクター関数を追加します。
VehiclesReducerの例：

Vehicle.reducer.ts （Characters-reducerについても同じことを繰り返します）

export interface VehicleState {
    // vehicle ids and entities etc...
    loading: boolean;
    ready: boolean;
}

const initialState: VehicleState = {
    // other init values
    loading: false,
    ready: false
}

export function reducer(state = initialState, action: Action): VehicleState {
    switch (action.type) {
        // other cases...

        case VehicleActions.INIT_VEHICLES: {
            return Object.assign({}, state, {
                loading: true,
                ready: false
            });
        }

        case VehicleActions.VEHICLE_DATA_SUCCESS: {
            return Object.assign({}, state, {
                /* other reducer logic like
                 * entities: action.payload
                 */
                loading: false,
                ready: true
            });
        }

        default:
            return state;
    }
}

// Selector functions
export const getLoading = (state: VehicleState) => state.loading;
export const getReady = (state: VehicleState) => state.ready;

次に、ルートリデューサーまたはセレクターを配置する追加フ​​ァイルで、目的の派生状態を提供するセレクターを作成します。

セレクター.ts

import { MyGlobalAppState } from './root.reducer';
import * as fromVehicle from './vehicle.reducer';
import * as fromCharacter from './character.reducer';
import { createSelector } from 'reselect';

// selector for vehicle-state
export const getVehicleState  = (state: MyGlobalAppState) => state.vehicle;
// selector for character-state
export const getCharacterState = (state: MyGlobalAppState) => state.character;

// selectors from vehicle
export const getVehicleLoading = createSelector(getVehicleState, fromVehicle.getLoading);
export const getVehicleReady = createSelector(getVehicleState, fromVehicle.getReady);

// selectors from character
export const getCharacterLoading = createSelector(getCharacterState, fromCharacter.getLoading);
export const getCharacterReady = createSelector(getCharacterState, fromCharacter.getReady);

// combined selectors that will calculate a derived state from both vehicle-state and character-state
export const getLoading = createSelector(getVehicleLoading, getCharacterLoading, (vehicle, character) => {
    return (vehicle || character);
});

export const getReady = createSelector(getVehicleReady, getCharacterReady, (vehicle, character) => {
    return (vehicle && character);
});

これで、コンポーネントで次のセレクターを使用できます。

import * as selectors from './selectors';

let loading$ = this.store.select(selectors.getLoading);
let ready$ = this.store.select(selectors.getReady);

loading$.subscribe(loading => console.log(loading)); // will emit true when requests are still running
ready$.subscribe(ready => console.log(ready)); // will emit true when both requests where successful

このアプローチはより冗長かもしれませんが、よりクリーンで、確立されたreduxのプラクティスに従います。そして、全体を省略できるかもしれませんinitReducer。

これまでセレクターを使用したことがない場合は、ngrx-example-appに表示されます。

アップデートについて：

ルーターを使用しているため、たとえば、ルーターガードを使用して、初期化が完了するまでルートのアクティブ化を保留できます。CanActivateインターフェースを実装します。

@Injectable()
export class InitializedGuard implements CanActivate {
    constructor(private store: Store<MyGlobalAppState>) { }

    canActivate(): Observable<boolean> {
        return this.store.select(fromRoot.getInitState) // select initialized from store
            .filter(initialized => initialized === true)
            .take(1)
    }
}

次に、ガードをルートに追加します。

{
    path: 'vehicle/:id',
    component: VehicleComponent,
    canActivate: [ InitializedGuard ]
}

ルートアクティベーションガードもngrx-example-appに表示されます。こちらをご覧ください