Getting object property in Angular 2

Question

I have a subscription on an object that comes in. I'm trying to get one property of that object - publishedOn but keep running into problems with it Cannot read property 'publishedOn' of undefined in the console.

This is my subscription:

 ngOnInit() {

    //Get the source from the source display panel
    this.subscription = this.sourceDisplayService.currentSource.subscribe(source => this.source = source);

    this.compareDates(this.source);

My date comparison method:

 compareDates(source){
    let context;
    let dateP = this.source;
    console.log(source.publishedOn);
    let publishedDate = new Date(dateP.publishedOn); 
     if (this.source.publishedOn <= this.electionDate) {
        let context = "Pre-election";
     } else {
        let context = "Post-election";
     }
     console.log(context);
     return context;
  }

Put the call to compareDates **inside** the callback passed to subscribe(). It's an asynchronous call. You can't access the data immediately after requesting it. That's like wanting to eat a toast immediately after putting the bread into the toaster. You can only eat your toast once the toaster has told you it's ready. — JB Nizet, Oct 27 '17 at 17:40

score 0 · Answer 1 · answered Oct 27 '17 at 17:43

ok the first thing thats highlighted here is trying to process a property before it's available.

The below modified code should work (remember than when you subscribe to an EventEmitter it's asynchronous code, everything after the code statement where you subscribe will execute non-blocking, but then the value isn't available yet... Not sure why you're assigning it to this.subscription but I'm not seeing the rest of the code so it might be that you want to use an Observable for what it is (in which case rest of the relevant code is needed to see what needs to be done to attach the async live feeding...) or it might be that you really just want to get that response and do something with it (as one would in a Promise, in this case you don't assign as it's not of any purpose in how the Observables work)...

If the below isn't working (I didn't test it) then elaborate on the rest of the code...

gOnInit() {

//Get the source from the source display panel
this.sourceDisplayService.currentSource.subscribe(
                      source => {
                             this.compareDates(source);
                             // remember that anything else that needs to happen when this value changes needs to be triggered either in compareDates or afterwards inside this code block (curly brackets)...
                    );

okay, but i'm trying to get the subscribed source as well as it displays in my component. your code i understand, but it interferes with the display of the source. is there a way i can chain the subscribe method? — averroes, Oct 27 '17 at 17:55
There is, just depends on more details of the nature of what you're trying to get and then display. Example: you can use forkJoin to call a series of Observables and the forkJoin blocks until all the Observables have finished (have emitted a .complete() after their last .next() ). You then get an array of the results of the array of observables you passed to forkJoin in the same ordering. Another is if you have a template element that needs to update each time the subscribed observable emits, assign the observable to a variable, pipe that variable to async, rough example: ="myVar | async" — Marius Conradie, Oct 28 '17 at 06:48

Getting object property in Angular 2

1 Answers1