4

アプリで ngrx/store を使用していますが、配列の保存に問題があります。私の配列は、起動時に次のように空に設定されています。

export interface AppState{
    customObjects: Array<CustomObject>;
};

export const initialState: AppState = {
    customObjects: []
};

次の関数を使用して、2 つの CustomObjects の配列を手動でフィードしようとしています。

loadCustomObjects() {
    let initialItems: CustomObject[] = [
        {
            directoryName: "d_name_1",
            brokenLinks: 0,
        },
        {
            directoryName: "d_name_2",
            brokenLinks: 0,
        }
    ];

    this.appStore.dispatch({ type: LOAD_CUSTOM_OBJECTS, payload: initialItems });
}

この関数を呼び出すと、レデューサー関数への呼び出しがディスパッチされます。

export const mainReducer: ActionReducer = (state: AppState, action: Action) => {

if (typeof state == 'undefined') {
    state = initialState;
}

switch (action.type) {
    case LOAD_CUSTOM_OBJECTS:
        return Object.assign({}, action.payload)
    default: {
        return state;
    }
}

}

これで問題ないように見えますが、メイン アプリ コンポーネントの配列が 2 つのオブジェクトを取得していません。これら 2 つの CustomObjects を持つようにデフォルトの状態を手動で設定すると、うまくいきます (いつでも配列を更新できるようにする必要があるため、これを行うことはできません)。私の HomeComponent は以下を使用します:

customObjects$ Observable<Array<CustomObject>>;

constructor(private appStore: Store<AppState>) {
            appstore.select('mainReducer')
            .subscribe((data: AppState) => {

                if (typeof data != 'undefined') {
                    this.customObjects$ = Observable.of(data.customObjects);
                }
            });
}

オブジェクトを分析したところ、'this.customObjects$' が 2 つの CustomObjects の配列になることが予想されます。代わりに、ScalarOservable です。

ScalarObservable {_isScalar: true、値: undefined、スケジューラー: null} など。

注 - 必要かどうかはわかりませんが、ホーム コンポーネントの @Component セクションに ChangeDetectionStrategy.onPush を含めました。私も使用することを確認しました

StoreModule.provideStore({ mainReducer })

私の app.module クラスで。

私が間違っていることと、「this.customObjects $」が2つのオブジェクト配列ではない理由を誰かが知っていますか? ngrx/store は初めてです - レデューサー関数が配列を設定する方法に問題があるように感じますが、よくわかりません。

4

1 に答える 1