I am facing an issue where I want to pass an object from a component to a service and then fetch it in another component as an observable. The idea is that any changes made in the Question Component should automatically update the Service. However, at present, the getQuestion() method is not functioning properly for the Question Component.
Service:
selectedSurvey: any;
setQuestion(passedObject){
this.selectedSurvey= passedObject;
}
getQuestion(): Observable<any>{
return this.selectedSurvey;
}
Survey Component
private subscription: Subscription;
survey: any;
onChange(surveyObject) {
this.surveyService.setQuestion(surveyObject);
}
ngOnInit() {
this.subscription = this.surveyService.getSurveys().subscribe( survey => { this.survey = survey });
}
Survey Component Html
<div class="container">
<div class="form-group">
<label for="sel1">Select Survey:</label>
<select class="form-control" [(ngModel)]="selectedObject" id="selsurvey" (ngModelChange)="onChange($event)">
<option *ngFor="let s of survey" [value]="s">{{s.surveyName}}</option>
</select>
</div>
</div>
Question Component
private subscription: Subscription;
survey: any;
constructor(private surveyService: SurveyService) { }
ngOnInit() {
this.subscription = this.surveyService.getQuestion().subscribe( survey => { console.log(survey),this.survey = survey })
}
}