Угловая область действия этого ключевого слова 6 отличается в дочерних компонентах - PullRequest
Новая
       12

Угловая область действия этого ключевого слова 6 отличается в дочерних компонентах

0 голосов
/ 04 декабря 2018

У меня есть компонент, который мы можем назвать Profile-Main.Profile-Main имеет следующую функцию извлечения данных: 

  getData(text: string): Observable<Response> {
    const baseUrl = environment.apiURL + "Profile/";
    const params = new HttpParams().set('userName', text);

    return this.httpClient
      .get(baseUrl + 'GetUser', {params: params})
      .map(response => <Response>response);
  }

Теперь компонент Profile-Main использует компонент угловых входных тегов (ngx-chips).Я пытаюсь реализовать функцию автозаполнения, которая передает ссылку в функцию getData следующим образом: 

    <div class="col-sm-10">
        <tag-input class="tag-chips" [secondaryPlaceholder]="'Enter your User Name'"
            name="userName" [ngModel]="['Test User']" [maxItems]="1" [ripple]="false"
            [onlyFromAutocomplete]="true">

            <tag-input-dropdown [appendToBody]="false" [displayBy]="'Name'" [identifyBy]="'id'"
              [autocompleteObservable]="getData">
            </tag-input-dropdown>
          </tag-input>
    </div>

Теперь проблема заключается в том, что при обращении к методу getData, this.httpClient не определено, потому что при этомукажите, что область действия ключевого слова this относится к TagInputDropdownComponent, а не к ProfileMainComponent.

. Как мне обойти эту проблему?Я вижу, что в сети есть много источников по входным параметрам, но проблема в том, что я не могу напрямую редактировать этот пакет npm?

Я новичок в angular 6, но должен быть простой способрешить эту проблему?

1 Ответ

0 голосов
/ 04 декабря 2018

Если вам разрешено редактировать компонент, имеющий функцию getData, попробуйте использовать синтаксис функции Arrow, он автоматически связывает this. 

getData = (text) : Observable<Response> =>  {
    const baseUrl = environment.apiURL + "Profile/";
    const params = new HttpParams().set('userName', text);

    return this.httpClient
      .get(baseUrl + 'GetUser', {params: params})
      .map(response => <Response>response);
  }
...