Панель поиска адреса в Angular с наблюдаемым URL с рекомендациями - PullRequest
Новая
       24

Панель поиска адреса в Angular с наблюдаемым URL с рекомендациями

0 голосов
/ 09 апреля 2020 
export class AddressSuggestionsService {
  private addressSuggestionsUrl =
    'http://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/findAddressCandidates?f=json&singleLine=';

  constructor(private httpClient: HttpClient) {}

  getAddressSuggestions(term: string): Observable<any> {
    return this.httpClient
      .get(
        `${this.addressSuggestionsUrl}${term}&outfields=Match_addr,Addr_type=PointAddress`
      )
      .pipe(
        tap((data) => console.log('All: ' + JSON.stringify(data))),
        catchError(this.handleError)
      );
  }
}

Я создаю панель автозаполнения для поиска адресов в Angular. Адрес-предложения приходят от стороннего поставщика в URL. У меня проблемы с извлечением определенного ключа из наблюдаемого ответа. Ключ называется Кандидаты . Можно ли извлечь только ключ из наблюдаемого ответа при обслуживании? GitHub репо

Ответы [ 2 ]

1 голос
/ 09 апреля 2020

используйте оператор карты для преобразования ответа во что-то еще.

Хорошая идея - создавать типы для ваших ответов. это облегчит вам завершение кода в сравнении с кодом. 


interface AddressSuggestionResponse {
  Candidates: string[]
}

export class AddressSuggestionsService {
  private addressSuggestionsUrl =
    'http://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/findAddressCandidates?f=json&singleLine=';

  constructor(private httpClient: HttpClient) {}

  getAddressSuggestions(term: string): Observable<string[]> {
    return this.httpClient
      .get<AddressSuggestionResponse>(
        `${this.addressSuggestionsUrl}${term}&outfields=Match_addr,Addr_type=PointAddress`
      )
      .pipe(
        map((data) => data.Candidates),
        catchError(this.handleError)
      );
  }
}
0 голосов
/ 10 апреля 2020 
  searchAddress(term: string): Observable<Address[]> {
    let url = `${this.endpoint}${term}&maxLocations=5&location=30.270,-97.745&distance=80467.2`;

    if (!term.trim()) {
      return of([]);
    }
    return this.httpClient
      .get<Address[]>(url)
      .pipe(
        map((data) => data['candidates']),
          catchError(this.handleError<Address[]>('addresses', []))
        );
  }
  private handleError<T>(operation = 'operation', result?: T) {
    return (error: any): Observable<T> => {
      console.log(`failed: ${error.message}`);
      return of(result as T);
    };
  }
}
...