无法读取未定义的属性'map‘与ngrx一起使用angular

export interface AppState {
  data: any[];
}

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

export function reducer(state = initialState, action: any): AppState {
  switch (action.type) {
    case 'FETCH_DATA_SUCCESS':
      return {
        ...state,
        data: action.payload
      };
    default:
      return state;
  }
}

import { Component, OnInit } from '@angular/core';
import { Store, select } from '@ngrx/store';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-my-component',
  template: `
    <ul>
      <li *ngFor="let item of data$ | async">{{ item }}</li>
    </ul>
  `
})
export class MyComponent implements OnInit {
  data$: Observable<any[]>;

  constructor(private store: Store<any>) {}

  ngOnInit() {
    this.data$ = this.store.pipe(select('data'));
  }
}

<ul *ngIf="data$ | async as data">
  <li *ngFor="let item of data">{{ item }}</li>
</ul>