如何将 value.lng 分配给 [纬度] 和 [经度]？

问题描述

image

从列表中选择城市时，我想传递经度 和地图的纬度

<form class="example-form">
  <mat-form-field class="example-full-width">
    <mat-label>Town/Settlement</mat-label>
    <input type="text"
           placeholder="Pick one"
           aria-label="Town/Settlement"
           matInput
           [matAutocomplete]="auto">
    <mat-autocomplete #auto="matAutocomplete">
      <mat-option *ngFor="let value of mainService.city; index as i"  [value]="value.city_ascii" (click)="toggle(value)">
          {{value.city_ascii}}
      </mat-option>
    </mat-autocomplete>
  </mat-form-field>

  <agm-map [latitude] [longitude]>
    <agm-marker [latitude] [longitude]></agm-marker>
  </agm-map>
</form>

解决方法

mat-autocomplete 在其 API 中有几个输出 - https://material.angular.io/components/autocomplete/api。所以你需要从 mat-option 中删除一个点击事件，然后像

<mat-autocomplete #auto="matAutocomplete" (optionSelected)="toggle(value)">

如果我正确理解组件类中的逻辑

旁注： 从角度 9 开始，有一个原始的角度分量 (https://www.npmjs.com/package/@angular/google-maps)。它比 agm 轻得多。在这里你可以找到一些使用它的例子 - https://timdeschryver.dev/blog/google-maps-as-an-angular-component