在@ngrx/effects中处理非JSON数据

import { Injectable } from '@angular/core';
import { Actions, createEffect, ofType } from '@ngrx/effects';
import { Observable, of } from 'rxjs';
import { catchError, map, mergeMap } from 'rxjs/operators';

@Injectable()
export class MyEffect {
  constructor(private actions$: Actions) {}

  myEffect$ = createEffect(() =>
    this.actions$.pipe(
      ofType('[MyFeature] Load Data'),
      mergeMap(() =>
        // 发起异步请求获取非JSON数据
        this.myService.getData().pipe(
          map((data: any) => ({ type: '[MyFeature] Data Loaded', payload: data })),
          catchError((error: any) => of({ type: '[MyFeature] Load Data Error', payload: error }))
        )
      )
    )
  );
}

import { Component } from '@angular/core';
import { Store } from '@ngrx/store';

@Component({
  selector: 'my-component',
  template: `
    <button (click)="loadData()">Load Data</button>
  `
})
export class MyComponent {
  constructor(private store: Store) {}

  loadData() {
    this.store.dispatch({ type: '[MyFeature] Load Data' });
  }
}