【问题标题】:Ionic - Uncaught (in promise): TypeError: Cannot read property 'then' of undefined离子 - 未捕获(承诺):TypeError:无法读取未定义的属性'then'
【发布时间】:2020-03-12 14:43:26
【问题描述】:

我在 Ionic 应用程序运行时收到此错误。我正在尝试实现 Ionic “Email Composer” 库以从客户端发送电子邮件,请参考此链接以了解我正在遵循的代码; [https://ionicframework.com/docs/native/email-composer][1] 。 错误的流程是当我测试应用程序时,我点击了一个触发“LoadingDialog”功能的按钮,该功能触发了发生错误的“SendEmail”功能。我不确定如何修复这个错误,但我认为它与我还不理解的 promise 的语法有关。感谢您提供的任何帮助!

错误中出现的代码行

this.emailComposer.isAvailable().then((available: boolean) =>{ //

this.SendEmail(); //

错误

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'then' of undefined   TypeError: Cannot read property 'then' of undefined
     at HomePage.SendEmail (home.page.ts:221)
     at HomePage.<anonymous> (home.page.ts:109)
     at Generator.next (<anonymous>)
     at fulfilled (tslib.es6.js:70)
     at ZoneDelegate.invoke (zone-evergreen.js:359)
     at Object.onInvoke (core.js:34201)
     at ZoneDelegate.invoke (zone-evergreen.js:358)
     at Zone.run (zone-evergreen.js:124)
     at zone-evergreen.js:855
     at ZoneDelegate.invokeTask (zone-evergreen.js:391)
     at resolvePromise (zone-evergreen.js:797)
     at zone-evergreen.js:707
     at fulfilled (tslib.es6.js:70)
     at ZoneDelegate.invoke (zone-evergreen.js:359)
     at Object.onInvoke (core.js:34201)
     at ZoneDelegate.invoke (zone-evergreen.js:358)
     at Zone.run (zone-evergreen.js:124)
     at zone-evergreen.js:855
     at ZoneDelegate.invokeTask (zone-evergreen.js:391)
     at Object.onInvokeTask (core.js:34182)

代码(home.page.ts)

            import { EmailComposer } from '@ionic-native/email-composer/ngx';

            export class HomePage {

            constructor(private http: Http, public loadingController: LoadingController,
                    public alertController: AlertController, 
                    private emailComposer: EmailComposer) {
           //constructor
            }
        async LoadingDialog(httpformdata) {//loading circle symbol
            const loading = await this.loadingController.create({
                message: 'Please wait...',
                duration: null
            });
            this.loading = loading;
            this.loading.present();
            console.log('ion dialog created.');
            /***  SendEmail  ***/
            this.SendEmail(); //<<<<<<<< THIS IS LINE 109 IN home.page.ts file
            /***  GET REQUEST  ***/
            this.GET_request(httpformdata);
            /***  POST REQUEST  ***/
            //this.POST_request(httpformdata);
            console.log('request made in async.');

            //this.loading.dismiss();
            //console.log('ion dialog dismissed.');

            const { role, data } = await loading.onDidDismiss();

            console.log('Loading dismissed!');
        }
            async RegularAlert(the_header: String, the_message: String) {//customized alert() dialog
            const alert = await this.alertController.create({
                header: '' + the_header,
                message: '' + the_message,
                buttons: ['OK']
            });
            await alert.present();
            return alert.getAttribute("header");
        }

        SendEmail(){
                this.emailComposer.isAvailable().then((available: boolean) =>{  //<<<<<<<< THIS IS LINE 221 IN home.page.ts file
                    if(available) {
                    //Now we know we can send
                    this.RegularAlert("testing the isAvailable().then", "available is true");//print a debug message to test functionality of   

                    let email = {
                        to:'max@mustermann.de',
                        cc: 'erika@mustermann.de',
                        bcc: [],
                        attachments: [],
                        subject: 'Cordova Icons',
                        body: 'How are you? Nice greetings from Leipzig',
                        isHtml: false
                      }

                      // Send a text message using default options
                      this.emailComposer.open(email);
                    }
                    else{
                        this.RegularAlert("testing the isAvailable().then", "available is false");
                    }
                });

        } 

    }

【问题讨论】:

  • 您正在对this.emailComposer.isAvailable() 返回的值调用then()。并且错误消息告诉您不能在未定义时调用.then()。你的结论是什么?
  • 看起来我需要在 this.emailComposer.isAvailable() 承诺调用周围添加一个 window.plugin 检查,就像这个家伙 youtu.be/kFfNTdJXVok?t=190,我能看到的唯一问题是他的 ionic在我的运行 angular 4 的地方运行 angularjs?你怎么看@JB Nizet
  • 我认为 this.emailComposer.isAvailable() 正在返回 undefined 而不是按原样返回承诺,因此您应该修复此方法的代码。
  • Visual Studio 代码说在“window”变量上找不到“plugins”库,我认为这是因为它仅适用于 angularjs。对我来说,我正在运行 Angular 4,所以我可以使用“if(this.platform.is('cordova')){//将此用于 android、iOS、Windows-Mobile 等”,因为 youtu.be 中的那个人/kFfNTdJXVok?t=190 说他添加了“window.plugins && window.plugins.emailComposer”,因为他知道这些插件在网络浏览器中不可用,这是我在(网络浏览器)中测试我的代码的地方错误。我将在我的安卓手机上测试电子邮件编辑器,看看错误是否消失。

标签: angular ionic-framework promise angular-promise


【解决方案1】:

我不确定您是否找到了问题的根源。但问题与您的环境有关,您需要在模拟器/手机中进行测试以避免此异常

【讨论】:

  • 问候 Faouzi,感谢您的回答,我一直在尝试在 android 手机上测试该应用程序,但我不能,因为当我尝试构建 android apk 时出现构建错误使用 ionic 命令行使用命令:ionic cordova build android
  • 您是否尝试解决在尝试构建应用时显示的错误?您肯定在代码中遗漏了一些东西
  • 除了将电子邮件编写器库添加到 ng 模块文件夹并在相关文件中添加电子邮件编写器的代码之外,我没有进行任何其他更改。我之前遇到过 ionic 没有构建 android 应用程序的问题。我很确定它与 ionic 有关,因为该应用程序构建在网络浏览器中。
  • 1- 在添加邮件编写器之前,您是否能够构建您的 apk? 2-您是否调试过为什么 ionic 无法构建 apk ?只需返回并阅读日志,您就会看到导致确切行问题的文件
  • 我没有弄清楚确切的问题,但我在这里遇到的错误是:stackoverflow.com/q/49641291/3576562,除了我的错误没有指定任何源代码行或需要的配置文件之外,一切都是一样的变化。我的解决方案是我创建了一个新的裸项目并记得运行“npm update”并更新了我的 app-root 组件 html 文件,因为 ionic 更新了一些阻止我的选项卡运行的库。所以我认为离子更新阻止了我的离子应用程序构建 android sdk apk,“npm update”由修复
【解决方案2】:

发生此错误是因为我没有在模拟器或 Android 手机上运行该应用程序,因为 Cordova 库仅与 Android 操作系统等移动操作系统一起运行。您需要的最低要求是:

if (this.platform.is('cordova')){ //在此处运行电子邮件编写器代码 }

在我在安卓手机上运行代码后,这段代码对我有用:

if (this.platform.is('cordova')){//use this for android,iOS,Windows-Mobile,etc){
            try {
                this.emailComposer.isAvailable().then((available: boolean) =>{
                    if(available) {
                        //Now we know we can send
                        let email = {
                            to: 'test1@gmail.com',
                            cc: 'test2@gmail.com',
                            bcc: [],
                            attachments: [],
                            subject: 'Cordova Icons',
                            body: 'How are you? Nice greetings from Leipzig',
                        isHtml: false
                        }//email object close

                    //Send a text message using default options
                    this.emailComposer.open(email);//opens user prompt to use third party email app with the email message above.
                    }//if close 
                    else{
                        console.log("Rare Error inside of the promise returned by the emailComposer.isAvailable()", "promise error");//TEST PRINT
                    }
                });
            } catch(e){
                  //catches the "this.emailComposer.isAvailable()" variable if the email composer plugin is not available on the installed phone   
            }
        }//if this.platform.is close
        else{
            console.log("Platform is not cordova/mobile","You are running in browser, this.emailComposer.isAvailable() is undefined.");//TEST PRINT
        }//else close

这里是电子邮件编写器的源代码:https://ionicframework.com/docs/native/email-composer

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2019-05-16
    • 2018-05-28
    • 1970-01-01
    • 1970-01-01
    • 2018-06-28
    • 1970-01-01
    • 2018-06-03
    • 2020-09-24
    相关资源
    最近更新 更多