谷歌地图未显示。
页面加载时会显示谷歌地图。但是当离子段被切换时，地图不会显示。以下是我的离子 2 代码：
<ion-header>
<ion-toolbar no-border-top>
<ion-segment [(ngModel)]="social" (ionChange)="segementChangeAction()">
<ion-segment-button value="activity">
Map
</ion-segment-button>
<ion-segment-button value="messages">
Messages
</ion-segment-button>
</ion-segment>
</ion-toolbar>
</ion-header>
<ion-content no-bounce>
<div [ngSwitch]="social">
<div *ngSwitchCase="'activity'">
<div #map id="map"></div>
</div>
<div *ngSwitchCase="'messages'">
Some text.....
</div>
</div>
</ion-content>
这是因为ngSwitchCase在切换离子段时从DOM中删除了映射的div。这样做：
<div [ngSwitch]="social">
<div [style.display]="social === 'activity' ? 'block' : 'none'">
<div #map id="map"></div>
</div>
<div *ngSwitchCase="'messages'">
Some text.....
</div>
</div>
为了使它在 Ionic 3 中工作，我必须进行一些调整，将高度：100% 添加到容器中：
<div [ngSwitch]="social">
<div [style.display]="social === 'activity' ? 'block' : 'none'" style="height: 100%">
<div #map id="map"></div>
</div>
<div *ngSwitchCase="'messages'">
Some text.....
</div>