Angular object array value throw error of undefined

Question

I am working on Angular 6 application. I have behaviour variable of Input, once I received data, I map to surveyInfo object. I have surveyInfoDataModel class as shown below; followed by I am trying to display this data by reading surveyInfo object in template but go error

error

ERROR TypeError: Cannot read property 'surveyId' of undefined

component

export class MyComponent implements OnInit {

@Input() surveySelectedToGetInfo: BehaviorSubject<any>;

ngOnInit() {

this.surveySelectedToGetInfo.subscribe(surveyDataItem=>{
  debugger;
  if(surveyDataItem!=null){
    this.loadSurveyInformation(surveyDataItem);
  }
 });
}

 private loadSurveyInformation(selectedSurveyObject:any):any{
 var mappedObject = this.mapSurveyInfo(selectedSurveyObject);
}

 private mapSurveyInfo(survey:any):SurveyInfoDataModel{
 if(survey!=null){

  this.surveyInfo = new SurveyInfoDataModel(
    survey.consultationId,
    survey.surveyId,
    survey.surveyIdNum,
    survey.surveyName
  );  
 }
  return this.surveyInfo;
}

Survey Info DataModel class

export class SurveyInfoDataModel{
    surveyId:string;
    surveyIdNum:string;
    surveyName:string;
    consultationId:string;

constructor(consultationId, surveyId, surveyIdNum, surveyName ){
    this.consultationId =consultationId;
    this.surveyId = surveyId;
    this.surveyIdNum = surveyIdNum;
    this.surveyName = surveyName;

 }
}

html template

<div class="surveyListInfoBlock">
 <div *ngIf="surveyInfo">
   {{surveyInfo.surveyId}}
 </div>
</div>

What happens if you changes if(survey!=null){ to if (typeof survery !== 'undefined' && survey!==null) ? — distante
– distante, Commented Jan 31, 2019 at 11:19
I still got same error... i got mapped correctly and I can see data in this.surveyInfo debugger, thats why i am confused of where things go wrong — K.Z
– K.Z, Commented Jan 31, 2019 at 11:21
Are you sure that your observable surveySelectedToGetInfo returns a value? — distante
– distante, Commented Jan 31, 2019 at 11:24
i think i have issue in template ... i update my question with template block ...if you can kindly refer it .. thanks — K.Z
– K.Z, Commented Jan 31, 2019 at 11:35

howHighUR · Accepted Answer · 2019-01-31 11:43:59Z

2

Try to change if(survey!=null) to if(!survey) return;. Looks like you going to return undefined if there is no survey cause return statement is outside the brackets. If it will work, you'll need to check all props of this object on undefined. Also you need to add typing to this object.

private mapSurveyInfo(survey:any):SurveyInfoDataModel{
    if (!survey) return;

    this.surveyInfo = new SurveyInfoDataModel(
      survey.consultationId,
      survey.surveyId,
      survey.surveyIdNum,
      survey.surveyName
    );  

    return this.surveyInfo;
}

edited Jan 31, 2019 at 11:43

answered Jan 31, 2019 at 11:27

howHighUR

1951 silver badge11 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

K.Z Over a year ago

i think i have issue in template ... i update my question with template block ...if you can kindly refer it .. thanks

howHighUR Over a year ago

No, it's ok with template, try my snippet

Melchia · Accepted Answer · 2019-01-31 11:37:49Z

1

Survey in your case is undefined. Instead of testing if survey is null you can test for both null & undefined with this:

 if(!!survey){
  this.surveyInfo = new SurveyInfoDataModel(
    survey.consultationId,
    survey.surveyId,
    survey.surveyIdNum,
    survey.surveyName
  );  
 }

answered Jan 31, 2019 at 11:37

Melchia

24.5k23 gold badges110 silver badges130 bronze badges

Collectives™ on Stack Overflow

Angular object array value throw error of undefined

error

component

Survey Info DataModel class

html template

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

error

component

Survey Info DataModel class

html template

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related