Маркер Google Map не отображается в моем приложении angular 4

Я выбрал в своем приложении Angular 4, в котором пользователь может выбрать список мест, отображаемых в этом. Выбор содержит следующий список мест следующим образом:

private parkedLocations: WebLocation[] = [
    {id: 1, name: 'ABC'},
    {id: 2, name: 'XYZ'},
    {id: 3, name: 'PQR'}
  ];

И вот соответствующий HTML-код,

<div class="container">
    <mat-form-field>
   <mat-select placeholder="Choose location" (change)="onChange($event)" (ngModel)="parkedLocations">
    <mat-option *ngFor="let location of parkedLocations" [value]="location">
      {{ location.name }}
    </mat-option>
   </mat-select>
  </mat-form-field>
  <div>
 </div>
    <agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="zoom">
        <agm-marker *ngFor="let marker of coordinates;" 
        [iconUrl]="icon" 
        [markerClickable]="true"
        [latitude]="marker.latitude" 
        [longitude]="marker.longitude">
    </agm-marker>
    </agm-map>

  </div>

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

private locationsToDraw: ParkingLocation [] ;//my model class
public coordinates: Coordinate[] = []; //class with lat and longitude properties
this.locationsToDraw = this.parkingServie.getLocations(option);
     console.log(this.locationsToDraw);
    for (let i = 0; i < this.locationsToDraw.length; i++ ) {
           // console.log(this.locationsToDraw[i]);
          const coordinate = new Coordinate( this.locationsToDraw[i].latitude, this.locationsToDraw[i].longitude);
          // console.log( 'Coordinate is :' + coordinate);
          this.coordinates.push(coordinate);
        }

и я получаю места, чтобы извлечь из службы следующим образом,

this.parkingLocations = [];
      this.getParkingLocationWithinArea(selectedLocation);//updates the this.parkingLocations[];
      return this.parkingLocations;

Но в настоящее время карта не обновляется с маркерами, основанными на выбранном местоположении в опциях выбора. Не удалось найти ошибку, пожалуйста, исправьте меня.

0 ответов

Другие вопросы по тегам