首页 > 解决方案 > Ionic 4 Google 使用 ReactiveForm 自动完成

问题描述

我想在我的项目中使用 googlemap places API 进行自动完成,但它给了我一个错误:

TypeError: Cannot read property 'getInputElement' of undefined

.html

<section
          [formGroupName]="i"
          *ngFor="let tech of form.controls.technologies.controls; let i = index">
          <ion-item-group>
              <ion-item-divider color="light">Station #{{ i + 1 }}</ion-item-divider>

             <ion-item>
                <ion-label position="floating">Technology name:</ion-label>
                <ion-input
                   #autoCompleteStation
                   type="text"
                   maxlength="50"
                   formControlName="name"></ion-input>
             </ion-item>



          </ion-item-group>
       </section>

.ts

@ViewChild('autoCompleteStation', {static: true}) autoCompleteStation: any;
  ngAfterViewInit(): void {
    this.autoCompleteStation.getInputElement().then((input:HTMLInputElement)=>{
        var autocomplete2 = new google.maps.places.Autocomplete(input, {

          //somee code
     });

    }
   });

PS:当我删除 for 循环时它可以工作,但是当我再次添加它时,它会给出上面的错误。请问有什么建议吗?

标签: javascriptangulargoogle-mapsionic-framework

解决方案


推荐阅读