Ionic 5 Cordova плагин EmailComposer NullInjectorError

#ionic-framework #cordova-plugins #ionic-native #capacitor

#ionic-framework #cordova-плагины #ionic-native #конденсатор

Вопрос:

Я делаю приложение, используя Ionic 5 и конденсатор.

package.json

 "dependencies": {
    "@angular/common": "~9.1.6",
    "@angular/core": "~9.1.6",
    "@angular/fire": "^6.0.2",
    "@angular/forms": "~9.1.6",
    "@angular/platform-browser": "~9.1.6",
    "@angular/platform-browser-dynamic": "~9.1.6",
    "@angular/router": "~9.1.6",
    "@capacitor/android": "^2.4.0",
    "@capacitor/core": "^2.4.0",
    "@capacitor/ios": "^2.4.0",
    "@ionic-native/core": "^5.27.0",
    "@ionic-native/email-composer": "^5.28.0",
    "@ionic/angular": "^5.2.3",
    "cordova-plugin-email-composer": "^0.9.2",
    "rxjs": "~6.5.1",
    "tslib": "^1.10.0",
    "zone.js": "~0.10.2"
  }
  

Я установил плагин Email Composer, чтобы открыть почтовый клиент пользователя для отправки электронного письма.

Установка с конденсатором:

 npm install cordova-plugin-email-composer
npm install @ionic-native/email-composer
ionic cap sync
  

Я создал сервис для реализации логики отправки электронных писем:

 import {Injectable} from '@angular/core';
import {EmailComposer, EmailComposerOptions} from "@ionic-native/email-composer/ngx";

@Injectable()
export class EmailService {

  constructor(
    private emailComposer: EmailComposer
  ) {
  }

  private get isEmailClientConfigured(): Promise<boolean> {
    return this.emailComposer.isAvailable();
  }

  /**
   * Tries to open an email client and populate the fields.
   */
  intentToSend(to: string) {
    if (this.isEmailClientConfigured) {
      const email: EmailComposerOptions = {
        to: to,
        isHtml: false
      };
      this.emailComposer.open(email);
    } else {
      console.log('Could not find an email configured.');
    }
  }
}
  

Ошибка в консоли:

ОШИБКА Ошибка: не обнаружена (в обещании): NullInjectorError: R3InjectorError(ContentModule)[EmailService -> EmailComposer -> EmailComposer -> EmailComposer -> EmailComposer -> EmailComposer]:
Ошибка NullInjectorError: нет поставщика для EmailComposer! Ошибка NullInjectorError: R3InjectorError(ContentModule)[EmailService -> EmailComposer -> EmailComposer -> EmailComposer -> EmailComposer]:
Ошибка NullInjectorError: нет поставщика для EmailComposer!

Увидев это, я добавил его в свой NgModule:

 import {NgModule} from '@angular/core';
import {EmailComposer} from "@ionic-native/email-composer";

@NgModule({
  declarations: [
  ],
  imports: [
  ],
  providers: [
    EmailComposer
  ]
})
export class SharedModule {
}
  

Теперь я получаю эту ошибку в консоли:

core.js: ОШИБКА 6228 Ошибка: Не перехвачено (в обещании): Ошибка: Недопустимый поставщик для NgModule ‘SharedModule’ — разрешены только экземпляры поставщика и типа, получено: […, …, …, …, …, ?[ объект Object]?] Ошибка: недопустимый поставщик для NgModule ‘SharedModule’ — разрешены только экземпляры поставщика и типа, получено: […, …, …, …, …, ?[ объект Object]?]

Есть идеи, как я могу это исправить?

Моя цель — правильно установить и реализовать плагин EmailComposer в моем проекте.

Ответ №1:

Добавьте EmailComposer в провайдер AppModule

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

@NgModule({
  declarations: [AppComponent ],
  imports: [
    BrowserModule, 
    IonicModule.forRoot(), 
    AppRoutingModule,
  ],
  providers: [
    ...
    EmailComposer 
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

  

Комментарии:

1. Спасибо, что пытались мне помочь. К сожалению, я получаю ту же ошибку: only instances of Provider and Type are allowed .

2. Я не получаю никакой ошибки, я пробовал с Ionic-5 проверить эту ссылку ionic-5-email-composer.stackblitz.io . Пожалуйста, попробуйте этот код на устройстве (в браузере отображается ошибка «cordova_not_available»)

3. Я получаю ту же ошибку, и я перепробовал все. У меня закончились идеи. По-видимому, мне не нужно объявлять Email Composer в AppModule. Мы можем сделать это на любом другом модуле. Я все еще ищу эту проблему и способы ее решения.

Ответ №2:

Чтобы добавить ответ Правина Пателя выше, попробуйте изменить код импорта из

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

к этому: (обратите внимание на ‘/ngx’)

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

Комментарии:

1. Спасибо, что исправили меня, я обновил свой ответ.

Ответ №3:

Добавьте класс использования с помощью provide

 import {EmailComposer} from "@ionic-native/email-composer";
import { IonicNativePlugin } from '@ionic-native/core';

...
...
...

providers: [
...
{ provide: EmailComposer, useClass: IonicNativePlugin}
]