У меня возникла проблема с отображением карты на моей странице. Это мой код:
<ion-header>
<ion-navbar>
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>
Cerca
</ion-title>
</ion-navbar>
<ion-toolbar>
<ion-segment [(ngModel)]="mySegment">
<ion-segment-button value="Mapa">
Mapa
</ion-segment-button>
<ion-segment-button value="Lista">
Lista
</ion-segment-button>
</ion-segment>
</ion-toolbar>
</ion-header>
<ion-content padding>
<div [ngSwitch]="mySegment">
<div #map id="map" style="height:100%;" *ngSwitchCase="'Mapa'" (click)="openBestofferdetailPage(offer)">
</div>
<div *ngSwitchCase="'Lista'">
<button ion-item *ngFor="let offer of offersmodelArray" (click)="openBestofferdetailPage(offer)">
<ion-thumbnail item-left>
<img src="{{offer.imageoffer}}">
</ion-thumbnail>
<p style="font-size:50%;">
<ion-row>
<ion-col>
<span item-left>{{offer.cityprovider}}</span>
<span item-left>({{offer.distanceToProvider}} km)</span>
</ion-col>
<ion-col right text-right>
<s>
<span item-right>{{offer.oldprice}}</span>
</s>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<span item-left>{{offer.sold}}</span>
<span item-left>comprados</span>
</ion-col>
<ion-col right text-right>
<b><p style="font-size:70%;" style="color:green">
<span item-right>{{offer.newprice}}</span>
</p></b>
</ion-col>
</ion-row>
</p>
</button>
</div>
</div>
</ion-content>
Опцией по умолчанию является «Mapa», однако она не показывает карту, я думаю, это проблема, связанная с настройкой положения и <ion-segment>
, но я был бы признателен за вашу помощь в понимании того, где я могу внести изменения.
В качестве дополнительной информации, если я установлю карту вне содержимого, карта будет отображаться без проблем.
<ion-content padding>
<div #map id="map" style="height:100%;"></div>
</ion-content>
Я видел связанный вопрос, но без ответа Ionic 2, используйте карты Google в ion -сегменты
Пожалуйста, помогите