Map Streams to Values to Affect State

The code still works, so maybe it's just an error with the typing definitions for rxjs, but the typescript compiler gives an error about using a Date object in startsWith()

Argument of type 'Date' is not assignable to parameter of type 'string | Scheduler'

This only pops up when you add mapTo('second') and mapTo('hour') to the two merged observables. Anyway, it doesn't seem to stop it from working, but I'm not sure if that's just luck.

I have the exact same problem. Can anyone suggest a solution of this lecture?

In my opinion, the probable cause is like below.

the very first stream for 'curr' is Date type, while 'curr' is expecting string. (in type script, compiler assumes 'curr' has to be the string as the source stream says.)

it seems like very non-deterministic in functional programming.

that is why the compiler argues about it.

Here is the code that works for me. You can use the optional parameter on scan() to initialize the value.

this.clock = Observable.merge(
  this.click$.mapTo('hour'),
  Observable.interval(1000).mapTo('second')
)
.scan((acc: Date, curr: string): Date => {
  const date = new Date(acc.getTime());
  if (curr === 'hour') {
    date.setHours(date.getHours() + 1);
  }
  if (curr === 'second') {
    date.setSeconds(date.getSeconds() + 1);
  }
  return date;
}, new Date());  // here is the optional initial value instead of using startWith()

}

But that is not the exact same behavior, because now the initial value only appears after a second (set the interval to 10000 to see it better). I just upgraded to Pro and am a little bit disappointed, that I get an example that throws errors in just my first course.

Edit: I came up with this: .startWith(new Date() || '') ... but that feels very hackish too

i have got same error, so i changed this example source like this

export class AppComponent { clock$: Subject<any> = new Subject();

clock;

constructor(){ this.clock = Observable.merge( this.clock$.mapTo('hour'), Observable.interval(1000).mapTo('second') ) .startWith( new Date().toString() ) .scan((acc, curr) => { let accDate = new Date(acc); const date = new Date(accDate.getTime());

  if(curr === 'hour') {
    date.setHours(date.getHours() + 1);
  }
  if (curr === 'second') {
    date.setSeconds(date.getSeconds() + 1);
    
  }
  return date;
})

} }

startWith operator Arguments is only string or Scheduler. so i change startWith new Date to string and in scan function that string change to Date Type.. run well ..

Changing

      .startWith(new Date())

to

      .startWith<Date | string>(new Date())

works for me.

this one works for me .startWith( <date|any> new Date())