Angular 2 Service not returning value assigned

Question

I am using service for sending data from a component to other.

My service follows

import {
    Injectable
} from '@angular/core';

@Injectable()
export class HomeService {
    values = new Array();

    setValues(values): void {
        this.values = values;
    }

    getValues(): any[] {
        return this.values;
    }
}

Setting value in a component

setType(type) {
  this.values["plan"] = "HMO";
  this.homeService.setValues(this.values);
}

Getting value in other

ngOnInit() {
  this.homeValues = this.homeService.getValues();   
  console.log(this.homeValues);
}

Above console printing [], how to get assigned values from service?

Mahmoud · Accepted Answer · 2017-11-10 08:41:55Z

4

You must use Observable

@Injectable()
export class HomeService {
    values:Observable<any> = [];

    setValues(values): void {
        this.values.next(value);
    }

    getValues(): Observable<any> {
        return this.values.getValue();
    }
}

and in your component, you use

ngOnInit() {
  this.homeService.values.subscribe(v => this.homeValues = v );   

}

edited Nov 10, 2017 at 8:41

answered Nov 10, 2017 at 8:12

Mahmoud

94613 silver badges30 bronze badges

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

2 Comments

Veera Over a year ago

I tried like this, coming SelectTypeComponent_Host.html:1 ERROR TypeError: Cannot read property 'subscribe' of undefined

Mahmoud Over a year ago

are you import HomeService and defined it in the constructor, like constructor(private homeService:HomeService )

Venomy · Accepted Answer · 2017-11-10 08:35:58Z

0

You are doing something wrong with this.values["plan"] = "HMO";.

This line would make and object like {plan:'HMO'}

So when you set this value to your service it does not save an array as you would expect.

Getting this value in turn would then return an empty array.

First change you could do is to type the setValues

 setValues(values:any[]): void {
        this.values = values;
 }

Secondly you have to change the first line I mentioned to actually make an array.

For example:

this.values = ["HMO"];

answered Nov 10, 2017 at 8:35

Venomy

2,24419 silver badges26 bronze badges

Collectives™ on Stack Overflow

Angular 2 Service not returning value assigned

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related