Angular 4无法从Store中选择State

时间:2017-09-14 16:10:41

标签: angular typescript ngrx ngrx-store

我有一个select()商店,我想将映射函数传递给export interface Thread { id: number; messageIds: number[]; participants: {[key: number]: number}; } ,以便从中选择一些数据。

我想要获取的接口就是这个:

mapStateToUserName

我设法通过映射函数unreadMessagesCounterstateToThreadSummariesSelector从商店获取一些其他数据,但由于某种原因,state无效。

当我尝试在stateToThreadSummariesSelector内记录undefinedexport interface ApplicationState { uiState: UiState; storeData: StoreData; }

ApplicationState接口:

  userName: Observable<string>;
  unreadMessagesCounter: Observable<number>;
  threadSummaries: Observable<ThreadSummary[]>;

  constructor(private threadsService: ThreadsService, private store: Store<ApplicationState>) {
    this.userName = store.skip(1).map(this.mapStateToUserName)
    this.unreadMessagesCounter = store.skip(1).map(this.mapStateToUnreadMessagesCounter)

    this.threadSummaries = store.select(this.stateToThreadSummariesSelector)
  }

  stateToThreadSummariesSelector(state: ApplicationState) {
      console.log(state) // undefined

      const threads = _.values<Thread>(state.storeData.threads)

      return threads.map(_.partial(this.mapThreadToThreadSummaries, state));
  }

  mapThreadToThreadSummaries(state: ApplicationState, thread: Thread): ThreadSummary {
    const names = _.keys(thread.participants).map(participantId => state.storeData.participants[participantId].name)
    const lastMessageId = _.last(thread.messageIds)
    const lastMessage = state.storeData.messages[lastMessageId]

    return {
        id: thread.id,
        participantNames: _.join(names, ","),
        lastMessageText: lastMessage.text,
        timestamp: lastMessage.timestamp
    }
  }

  mapStateToUserName(state: ApplicationState): string {
    return state.storeData.participants[state.uiState.userId].name
  }

  mapStateToUnreadMessagesCounter(state: ApplicationState): number {
    const currentUserId = state.uiState.userId;

    return _.values<Thread>(state.storeData.threads).reduce((acc, thread) => acc + thread.participants[currentUserId], 0)
  }

代码:

https://www.domain.tld/%20rel=

0 个答案:

没有答案