Ionic - toast 消息在 inappbrowser 的 'loaderror' eventlistner 函数中不起作用

Ionic - toast message not working inside 'loaderror' eventlistner function of inappbrowser

当给定的 url 无法在 inappbrowser 中加载时,我正在尝试显示 toast 消息, 这是我的代码

function BrowserLoadError(event) {
        browser.close();
        loading.dismiss();
        this.toast.show("Can't Load the app", '3000', 'center').subscribe(
            toast => {
                console.log(toast);
            }
        );
        //alert("This App can't be reached now");
    }

但是它不起作用,toast 消息没有显示,但是当我们从 eventlistner 函数以外的任何其他地方调用时它会显示。

如何让它在函数内运行?

这是我的完整代码

urlLink(data, target, options): void {
    let loading = this.loadingCtrl.create({
        spinner: 'bubbles',
        content: 'Processing',
        duration: 5000
    });

    let browser = cordova.InAppBrowser.open(data, target, options);

    browser.hide();
    loading.present();
    browser.addEventListener('loaderror', BrowserLoadError);

    function BrowserLoadError(event) {
        browser.close();
        loading.dismiss();
        this.toast.show("Can't Load the app", '3000', 'center').subscribe(
            toast => {
                console.log(toast);
            }
        );
        //alert("This App can't be reached now");
    }
}

经过一些测试,问题实际上是 this 在错误回调中使用时不是您的控制器。将引用保存在变量中应该可以解决这个问题(双关语):

urlLink(data, target, options): void {
    let self = this; //save the reference before

    let loading = this.loadingCtrl.create({
        spinner: 'bubbles',
        content: 'Processing',
        duration: 5000
    });

    let browser = cordova.InAppBrowser.open(data, target, options);

    browser.hide();
    loading.present();
    browser.addEventListener('loaderror', BrowserLoadError);

    function BrowserLoadError(event) {
        browser.close();
        loading.dismiss();
        //use your variable here
        self.toast.show("Can't Load the app", '3000', 'center').subscribe(
            toast => {
                console.log(toast);
            }
        );
        //alert("This App can't be reached now");
    }
}

与此同时,我也发现了问题并修复了

let toast = new Toast();
toast.show("This App can't be launched now", '5000', 'bottom').subscribe(
    toast => {
        console.log(toast);
    }
);