0

I'm facing an issue of typing when I call a web service on an effect

I have created the effect here

$LoadSchedulingsByMission = createEffect(() =>
  this.actions$.pipe(
    ofType<any>(ESchedulesActions.GetSchedulesByDirection),
    mergeMap(action =>
      this.apiCallsService.getDirections(action.payload, '2016-04-18').pipe(
        map(trips => ({ type: ESchedulesActions.GetSchedulesByDirectionSuccess, payload: trips })),
        catchError(() => EMPTY)
      )
    )
  )
);

the GetSchedulesByDirection Action

export class GetDirections implements Action {
  public readonly type = ESchedulesActions.GetSchedulesByDirection;
  constructor(public payload: string[]) {}
}

Then I call a http service

getDirections(data: string[], date:string) {
  const groupByDirection:any={};
  data.map(elm=> {
    let dirUrl=`.....date=${date}&directions=${elm}`
    this.http.get<ISchedules>(dirUrl).pipe(map(dirData=>{
      groupByDirection[elm].push(dirData.data)
    }))
  })
  return groupByDirection as ISchedules;
}

Finally Success Action

export class GetDirectionsSuccess implements Action {
  public readonly type = ESchedulesActions.GetSchedulesByDirectionSuccess;
  constructor(public payload: ISchedules) {}
}

The reducers

case ESchedulesActions.GetSchedulesByDirection: {
  return {
    ...state,
  };
}
case ESchedulesActions.GetSchedulesByDirectionSuccess: {
  return {
    ...state,
    directions: action.payload
  };
}

I'm getting this error

Type 'Observable' is not assignable to type 'Observable | ((...args: any[]) => Observable)'.
Type 'Observable' is not assignable to type 'Observable'. Property 'type' is missing in type '{}' but required in type 'Action'.

Update

I'm noticing that getDirection service function is returning an object, but in other same behaviour effects , services are returning Observable of objects.

So i modified my service to and error disappeared.

getDirections(data: string[], date:string) {
  const groupByDirection:any={};
  data.map(elm=> {
    let dirUrl=`...date=${date}&directions=${elm}`
    this.http.get<ISchedules>(dirUrl).pipe(map(dirData=>{
      groupByDirection[elm].push(dirData.data)
    }))
  })
  return of(groupByDirection);

Is it a a right solution ?

infodev
  • 4,673
  • 17
  • 65
  • 138

0 Answers0