Преобразование функции для использования пройденной переменной в приложении с угловым 2 с помощью наблюдаемых

Question

Я использую наблюдаемые для вывода данных в своем приложении Angular 2. Прямо сейчас у меня есть несколько сервисов/компонентов, которые делают почти то же самое, поэтому я хотел бы сделать этот «DRYer» путем рефакторинга, поэтому я могу просто передать один параметр, который отличается от API-вызова, который я создаю в компонентах , Таким образом, я могу использовать одну услугу для каждого из компонентов, нуждающихся в этом.

Позвольте мне сначала показать, что работает (для сравнения:):

В моей службы у меня было так:

getByCategory() { 
    this._url = "https://api.someurl.com/v0/contacts/group/staff?limit=15&apikey=somekey"; 
    return this._http.get(this._url) 
     .map((response: Response) => response.json()) 
     .catch(this._errorsHandler); 
} 
_errorsHandler(error: Response) { 
    console.error(error); 
    return Observable.throw(error.json().error || 'Server error'); 
} 

И в моем компоненте я подписавшись на это так:

this.contactService.getByCategory() 
    .subscribe(resRecordsData => this.records = resRecordsData, 
     responseRecordsError => this.errorMsg = responseRecordsError); 

Опять же, весь приведенный выше код работает.

Но потому что единственное, что отличается между вызовами из различных компонентов один параметр (группа) в вызове API, я хотел бы, чтобы реорганизовать, чтобы сделать что-то вроде этого:

getByCategory(group) { 
    const q = encodeURIComponent(group); 
    this._url = "https://api.someurl.com/v0/contacts/group/${q}?limit=15&apikey=somekey"; 
    return this._http.get(this._url) 
     .map((response: Response) => response.json()) 
     .catch(this._errorsHandler); 
} 
_errorsHandler(error: Response) { 
    console.error(error); 
    return Observable.throw(error.json().error || 'Server error'); 
} 

А потом в компонентах я бы подписаться на это, в то же время переходящие в параметре одна группа, которая различна для каждого компонента, например:

this.contactService.getByStage('staff') 
     .subscribe(resRecordsData => this.records = resRecordsData, 
     responseRecordsError => this.errorMsg = responseRecordsError); 

Когда я пытаюсь это, я не получаю никаких ошибок, но я также дон Не получайте никаких данных, напечатанных в представлении. Есть ли что-то, что мне не хватает при преобразовании этой функции?

Answer 1

Ответ заключается в том, что URL-адрес должен использовать обратные ссылки вместо кавычек, поскольку интерполяция используется в URL-адресе, переданном API.

this._url = `https://api.someurl.com/v0/contacts/group/${q}?limit=15&apikey=somekey`;