angular - Angular4 - why does promise from service resolve to undefined? -


i'm wrestling undefined return promise. detective work, seems problem assigning results promise instance variable on component calling promise. think type(or similar) problem arrow function try assign returned survey this.survey.

any insight appreciated!

./survey.service.ts

import { injectable } '@angular/core'; import { observable } 'rxjs/observable'; import { surveys } './mock-survey';  export class option { constructor(public id: number,           public text: string,           public value: number         ){} }  export class question { constructor(public id: number,           public type: string,           public text: string,           public required: boolean,           public options: option[] = []         ){} }  export class survey { constructor(public id: number,           public name: string,           public description: string,           public instructions: string,           public questions: question[] = []         ){} }  @injectable() export class surveyservice {    getsurveys(): promise<survey[]> {     return promise.resolve(surveys);   }    getsurvey(id: number | string): promise<survey> {     return this.getsurveys()       .then(surveys => surveys       .find(survey => survey.id === +id));   }    public observable: observable<any>; } 

./survey.component.ts

import 'rxjs/add/operator/switchmap'; import { observable } 'rxjs/observable'; import { component, oninit, inject, hostbinding }      '@angular/core'; import { mddialogref, md_dialog_data }  '@angular/material'; import { survey, surveyservice } '../survey.service';  @component({   selector: 'app-survey',   templateurl: './survey.component.html',   styleurls: ['./survey.component.scss'],   providers: [surveyservice] }) export class surveycomponent implements oninit {    survey: survey   surveyresults: {}    constructor(     private surveyservice: surveyservice,     public dialogref: mddialogref<surveycomponent>,     @inject(md_dialog_data) public data:   ) { }    // getsurveys(): void {   //   this.surveyservice.getsurveys().then(   //     surveys => this.surveys= surveys);   // }     // *this method returns undefined this.survey; not issue ngoninit()   // getsurvey(): void {   //   let survey_id = this.data.survey_id   //   this.surveyservice   //       .getsurvey(survey_id)   //       .then(s => {this.survey = s});   // }    ngoninit(): void {      this.surveyservice       .getsurvey(this.data.survey_id)       .then((survey: survey) => {this.survey = survey});      // returns survey_id md_dialog_data     console.log(this.data.survey_id)     // returns survey json object; arrives in browser console     console.log(this.surveyservice.getsurvey(this.data.survey_id));     // returns undefined     console.log(this.survey);   }    confirmsurveyresults() {     this.dialogref.close(this.surveyresults);     console.log(this.survey);   }   } 

promises asynchronous, survey undefined within ngoninit method's context:

  ngoninit(): void {      this.surveyservice       .getsurvey(this.data.survey_id)       .then((survey: survey) => {          this.survey = survey          console.log(this.survey);// here not undefined        });       // returns undefined because promise not fulfilled yet     console.log(this.survey);   } 

Comments

Popular posts from this blog

javascript - Create a stacked percentage column -

Optimising Firebase database by automatically overwriting data -

javascript - Angular UI-Grid customTemplate directive causing rows to load slowly/? -