在 ionic 3 Ionic - 当我们向下滚动时，Google 地点的自动完成位置与输入框分离

问题描述

在 ionic 中，我们使用 ionic geolocation for google maps…当我们搜索任何地方时，在搜索框的输入中，然后向下滚动到应用程序然后自动完成也会滚动并与输入搜索框设计分离。我应用了许多 CSS 来附加带有搜索输入的自动完成功能，但无法正常工作。

下面的代码在网络浏览器中运行良好，但在构建中不起作用。 html 文件

<ion-content class="bglightgray" #content padding>

    <div class="mapView">
        <div class="searchBar">
            <!-- <ion-searchbar placeholder="Search your Location" class="mapSearch" ></ion-searchbar> -->
            <div class="inp-wrap">

                <input id="MapInput" [(ngModel)]="mapname" class="mapSearch cs-mapSearch" type="text" placeholder="Search your Location" #MapInput>

                <div class="closeIcon" (click)="closeSearch()"></div>
                <div class="searchbarIcon"></div>
            </div>

        </div>
        <!-- <img src="assets/imgs/map.jpg" alt=""> -->
        <div #mapContainer id="mapContainer" [ngClass]=" { hideMap: !MapView}"></div>
    </div>
</ion-content>

ts 文件

import { Content,Events } from 'ionic-angular';
export class MapViewPage {
@ViewChild('content') content: Content;
constructor(){
}

    ngAfterViewInit() {
    this.content.ionScroll.subscribe((event) =>  {
      //console.log('scrolled');
        //var pacContainer = document.body.querySelector('.pac-container');
        const pacContainer = document.querySelector<HTMLElement>('.pac-container');
        pacContainer.style.display  = "none";
       });
  }
 }

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）