Получение ответа от API Google Map занимает 2 клика - проблема? - PullRequest
Новая
       36

Получение ответа от API Google Map занимает 2 клика - проблема?

0 голосов
/ 18 мая 2019

Я занимаюсь разработкой демонстрационного сайта, который должен выбирать близлежащие места в соответствии с местоположением пользователя. Пользователь может либо ввести пин-код, либо попросить сайт автоматически определить местоположение.

Рабочий процесс сайта - 1. Нажмите кнопку для отправки - либо есть пин-код, либо нет пин-кода 2. соответствующая функция вызывается в угловой составляющей 3. Компонент отправляет значение пин-кода (например, 110022 или неопределенное, если пользователь выбирает место автоматического определения) методу в AppService. 4. Этот метод вызывает соответствующий метод из MapServic. 5. MapService отвечает за отправку запроса в API Google Map, а затем возвращает ответ на вызов функции из AppService. 6. Затем AppService должен вернуть это значение в компонент 7. Шаблон отображает список элементов, используя ngFor, на основе этого возвращаемого значения (которое является массивом).

Проблема: мне нужно дважды нажать кнопку, чтобы узнать местоположение, а затем разместить результаты.

Что я понял - время отклика от API карты Google медленнее, чем время завершения метода вызывающей функции.

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

Я пробовал обратные вызовы клиентов, наблюдаемые и обещания.

  1. Метод в компоненте - 
 fetchLocation(form: NgForm) {
    console.log(form.value.pinCode);
    if (form.value.pinCode !== "") {
      const pinCode = form.value.pinCode;
      //this.placeType = form.value.type;
      this.appService.fetchLocationWithPin(pinCode, this.gmapElement);
    } else {
      this.location = this.appService.fetchLocation(this.gmapElement);

      console.log(this.location);
    }
  }
</code>

  fetchPlace(form: NgForm) {

    console.log(this.results);

    let placeType;
    if (form.value.type === "") {
      placeType = "restaurant";
    } else {
      placeType = form.value.type;
    }

    this.results = this.appService.fetchPlaces(
      this.location,
      placeType,
      this.gmapElement
    );
  }
  1. При условии, что вызов предназначен для определения местоположения автоопределением, метод AppService - 
fetchLocation(gmapElement) {

    this.location = this.mapServices.detectLocation(gmapElement);
    return this.location;
  }
  1. Метод MapService 
detectLocation(gmapElement) {
    navigator.geolocation.getCurrentPosition(
      position => {
        this.locationFound = true;

        this.location.lat = position.coords.latitude; this.location.lng = position.coords.longitude;

      },
      () => {
        alert("location not found");
        return null;
      },
      { enableHighAccuracy: true }
    );
  }

Что я понял - время отклика от API карты Google медленнее, чем время завершения метода вызывающей функции. Посоветуйте, пожалуйста, как мне решить эту проблему. Я пытаюсь понять это уже несколько недель, и я уверен, что где-то допустил ошибку.

...