離子3 popover不是旁邊的按鈕

我已經做了100秒的時間，它按預期工作，但只是這種情況。離子3 popover不是旁邊的按鈕

的酥料餅的樣子：

<ion-content style="padding:5px"> 
    <ion-label class="menu-options-link" (click)="doneTask()">Accept New Leads</ion-label> 
</ion-content>

啓動酥料餅的頁面看起來像：

<ion-card class="dashboard-widget-layout dashboard-widget"> 
    <ion-card-header class="dashboard-widget-card-header"> 
    <ion-grid> 
     <ion-row> 
     <ion-col> 
      <ion-label class="dashboard-widget-header">New Leads</ion-label> 
     </ion-col> 
     <ion-col col-auto> 
      <ion-icon name="ios-more" style="zoom:1.5"

（點擊）= 「showOptions（$事件）」>

發射ts是

showOptions(myEvent){ 
    //alert('hey') 
    var popover = this.leadOptionsPopup.create(LeadOptionsPage, {}, { cssClass: 'options-popover'});  
    popover.present({ 
    ev: myEvent 
    }); 
}

這應該這樣做，但彈出窗口只是相對於圖標而言。

來源

2017-09-25 Vik

您可以添加如何顯示它的屏幕截圖嗎？ –

https://www.dropbox.com/s/5nkgk7j6qshodeo/Screenshot%202017-09-24%2021.16.36.png?dl=0 – Vik

請將您的文章與圖片聯繫起來 –

因此，根據@ Sonicd300建議的替代佈局，我最終明白了罪魁禍首。它實際上是圖標樣式屬性縮放：1.5。我不知道爲什麼它弄亂了彈出窗口的位置，但刪除它或將其設置爲1.0將彈出窗口移動到正確的位置

來源

2017-09-27 03:47:08 Vik

在您的初始示例中沒有縮放：1.5 – Sonicd300

你爲什麼不使用ion-item代替ion-card-header與複雜的網格。

<ion-card class="dashboard-widget-layout dashboard-widget"> 

    <ion-item> 
     New Leads 
     <ion-icon name="ios-more" item-end (click)="showOptions($event)"></ion-icon> 
    </ion-item> 

</ion-card>

查看documentation here，它顯示了一張卡片，其中有一個項目作爲起始卡片元素。

請檢查也許這class="dashboard-widget-card-header"正在做的事情一起在popover功能：options-popover。

來源

2017-09-27 03:15:23 Sonicd300

離子3 popover不是旁邊的按鈕

回答

相關問題