Событие Ionic 3 (click) в Modal не работает в ios - PullRequest
3 голосов
/ 14 июня 2019

Я потерян с проблемой на IOS.Я внедряю чат, в котором у вас есть список контактов, и когда вы щелкнете по одному из них, он отобразит список связанных сообщений.Он отлично работает на Android и в браузере (даже в браузере IOS), но в IOS, когда я нажимаю на контакт для отображения сообщений, ничего не происходит.Моя функция не вызывается из html, даже когда я пытался разместить несколько кнопок тестирования повсюду на моем ионном контенте.Это работает только на моем ионном заголовке.

Не могли бы вы спасти мою жизнь?

Вот мой код:

HTML:

<ion-header>
    <ion-toolbar>
        <ion-buttons>
            <button ion-button (click)="displayChat(undefined)">
                Test (works here)
            </button>
        </ion-buttons>
    </ion-toolbar>
</ion-header>
<ion-content class="no-scroll" style="height: 100% !important;">
    <div>
        <button ion-button (click)="displayChat(undefined)">
            Test ?
        </button>
        <ion-list class="contactList">
            <ion-item *ngFor="let chat of chats" 
             (click)="displayChat(chat)">
                {{chat.contactName}}
                 <br>
                <span class="chatDate">
                    {{chat.lastMessageSend}}
                </span>
            </ion-item>
        </ion-list>
        <button ion-button (click)="displayChat(undefined)">
            Test ?
        </button>
    </div>
</ion-content>
<ion-footer>
    <ion-toolbar>
        <ion-title>Footer</ion-title>
        <button ion-button (click)="displayChat(undefined)">
            Test ?
        </button>
    </ion-toolbar>
</ion-footer>

TS:

displayChat(chat: Chat) {
    console.log("Ok");
}

Я сократил свой код, чтобы сделать его более читабельным.

Наслаждайтесь!

РЕДАКТИРОВАТЬ

.no-scroll .scroll-content {
    overflow: hidden;
}

.chatDate {
    float: right;
    font-size: 0.7em;
}

Этотоже не работает в нижнем колонтитуле.

Ответы [ 2 ]

1 голос
/ 21 июня 2019

Хорошо, я выяснил, в чем проблема.

На самом деле, этот код запускался в Ионный модал из Popover.

Мне пришлось держать свой Popover открытым, чтобы справиться с какой-то обработкойс помощью метода OnDidDismiss, но он может выполнять этот метод, только если всплывающее окно остается открытым.

Но в IOS (конечно) вы не можете щелкнуть модальное окно, если Popover (или, возможно, любой другой абсолютный элемент)) стоит за вашим модальным.

Итак, чтобы решить эту проблему, я создал Observable для обработки метода OnDidDismiss (модального), который я даю в качестве параметра метода viewCtrl.dismiss, чтобы получить его обратно.на OnDidDismiss в представлении Popover, а затем подписаться на Observable.

0 голосов
/ 20 июня 2019

Внутри вашего компонента кнопки, попробуйте добавить ионный элемент вместо ионного.У меня есть немного похожий код, где он работает нормально.

Например:

<button ion-item (click)="onClick()">Click me</button>

Дайте мне знать, что произойдет после этого!Будем готовы помочь.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...