如何将接口与我的reducer的初始状态(角度6)结合使用?当我将接口与减速器的初始状态结合使用时,会出现以下错误:
src / app / core / store / event / event.reducer.ts(8,14)中的ERROR:错误 TS2322:键入'{loading:false;已加载:false;失败:错误;数据: undefined []; selectedEvent:{}; }”不可分配给“事件”类型。 属性“ selectedEvent”的类型不兼容。 类型“ {}”不可分配给类型“事件”。 类型“ {}”中缺少属性“ id”。
event.interface.ts
export interface Event {
id: string;
title: string;
date: string;
place: string;
line: string;
type: string;
vehicle: string;
matriculeNr: string;
filterCTX: string;
status: string;
recordExisting: string;
mode: string;
module: string;
object: string;
eventId: string;
sharedObjects: SharedObject[];
eventTime: string;
eventCodeDescr: string;
eventCodeDescrCorp: string;
description: string;
selectedAsMain: boolean;
selectedAsDetail: boolean;
selected: boolean;
documents: Document[];
participants: Participant[];
}
export interface Events {
loading: boolean;
loaded: boolean;
failed: boolean;
data: Array<Event>;
selectedEvent: Event;
}
export interface Document {
id: string;
name: string;
docLink: string;
}
export interface Participant {
id: string;
relation: string;
firstName: string;
lastName: string;
updateUser: string;
updateDate: string;
}
export interface SharedObject {
id: string;
}
event.reducer.ts
import * as events from './event.actions';
import { tassign } from 'tassign';
import { Events } from '@app/core/interfaces/event.interface';
/**
* Initial state for events
*/
export const EVENTS_INITIAL_STATE: Events = {
loading: false,
loaded: false,
failed: false,
data: [],
selectedEvent: {},
};
/**
* Case functions
*/
function load(state: Events): Events {
return tassign(state, { loading: true });
}
function loadSuccess(state: Events, action: events.LoadSuccess): Events {
return tassign(state, {
loaded: true,
loading: false,
failed: false,
data: action.payload,
selectedEvent: {},
});
}
function loadFail(state: Events): Events {
return tassign(state, {
loaded: false,
loading: false,
failed: true,
data: [],
selectedEvent: {},
});
}
function selectMainEvent(
state: Events,
action: events.SelectMainEvent
): Events {
const updatedData = state.data.map(event => {
if (event.id === action.payload) {
return {
...event,
selectedAsMain: true
};
}
return {
...event,
selectedAsMain: false
};
});
return tassign(state, {
loaded: true,
loading: false,
failed: false,
data: updatedData,
selectedEvent: {},
});
}
function selectDetailEvent(
state: Events,
action: events.SelectDetailEvent
): Events {
const updatedData = state.data.map(event => {
if (event.id === action.payload.eventId) {
return {
...event,
selectedAsDetail: true
};
}
return {
...event,
selectedAsDetail: false
};
});
return tassign(state, {
loaded: true,
loading: false,
failed: false,
data: updatedData,
selectedEvent: action.payload,
});
}
/**
* EventsReducer
*
* @param state
* @param action
*/
export function reducer(
state: Events = EVENTS_INITIAL_STATE,
action: events.Actions
): Events {
switch (action.type) {
case events.LOAD:
return load(state);
case events.LOAD_SUCCESS:
return loadSuccess(state, action);
case events.LOAD_FAIL:
return loadFail(state);
case events.MAIN_EVENT_SELECTED:
return selectMainEvent(state, action);
case events.DETAIL_EVENT_SELECTED:
return selectDetailEvent(state, action);
}
return state;
}
/**
* Selectors
*/
export const getData = (state: Events) => state.data;
export const getSelectedEvents = (state: Events) =>
state.data.filter(event => event.selected);
export const getSelectedDetailEvent = (state: Events) => state.selectedEvent;
export const getLoading = (state: Events) => state.loading;
export const getLoaded = (state: Events) => state.loaded;
export const getFailed = (state: Events) => state.failed;