Угловой 2 - передача данных из службы в компонент

Question

Я создал службу, которая вызывает api для получения некоторых данных. Я хочу вернуть это вызывающему компоненту.

Это то, что у меня есть:

SomeComponent() { 
someData = string; 
constructor(
     private _configService: SomeService 
    ) 
    { 
     var value = this._configService.getKey('some-key'); 
     console.log(value); 
    } 
} 

Тогда у меня есть сервис:

export class ConfigService { 

    response:any; 

    constructor(private _http:Http) {} 

    getConfig(): Observable<any> 
    { 
     return this._http.get('src/config/config.json') 
      .map(response => response.json()).publishLast().refCount(); 
    } 

    getKey(key:string) { 
     this.getConfig() 
      .subscribe(
       data => { 

        if (data[key] != 'undefined') 
        { 
         return data[key] 
        } else { 
         return false; 
        } 

       }, 
       error => { 
        return false; 
       } 
      ); 

    } 

} 

Идея заключается в том, что я могу вызвать метод GETKEY ('некоторый ключ'), и если ключ существует в возвращаемом массиве json, данные возвращаются. Если нет, возвращается false.

Когда это выполняется, я вижу, что объект возвращается в службе, однако он не возвращается компоненту, вместо этого я получаю «неопределенный».

Каков процесс, чтобы вернуть это правильно?

Answer 1

Ваша проблема заключается в том, что ваша обработка является асинхронной и вы возвращаетесь внутри обратного вызова не внутри вызывающего метода.

Я хотел бы использовать оператор map для этого:

getKey(key:string) { 
    return this.getConfig().map(data => { 
     if (data[key] != 'undefined') { 
     return data[key]; 
     } else { 
     return false; 
     } 
    ); 
} 

и в компоненте:

SomeComponent() { 
    someData = string; 
    constructor(
    private _configService: SomeService 
) { 
    this._configService.getKey('some-key').subscribe(value => { 
     console.log(value); 
    }); 
} 

}