“没有 AlertController 的提供者！” npm 离子角度答案

【问题标题】："No provider for AlertController!" npm ionic-angular“没有 AlertController 的提供者！” npm 离子角度
【发布时间】：2018-11-05 04:30:36
【问题描述】：

以下代码用于 ionic 应用程序中的自定义启动屏幕组件，我已向服务器请求令牌和身份！使用“离子角度”：“^3.9.2”

import {Component, OnInit} from '@angular/core';
import {BackendService} from "../../services/backend.service";
import {SessionService} from "../../services/session.service";
import {AlertController} from "ionic-angular";

@Component({
    selector: 'app-splash-screen',
    templateUrl: './splash-screen.component.html',
    styleUrls: ['./splash-screen.component.scss']
})

export class SplashScreenComponent implements OnInit {

constructor(private backendService: BackendService,
            private sessionService: SessionService, private alertCtrl: AlertController) {

}

ngOnInit() {

    if (this.sessionService.getBearerToken()) {
        this.requestForIdentity();
    } else {
        this.backendService.Token().subscribe((response: any) => {
            this.sessionService.addAccessToken(response.access_token);
            this.sessionService.addRefreshToken(response.refresh_token);
            this.requestForIdentity();
        }, error => {
            console.log(error)
        })
    }
}

requestForIdentity() {
    this.backendService.GetIdentity().subscribe((response: any) => {
        console.log(response);
        this.showAlert();
    }, error => {
        console.log(error);
    })
}

showAlert() {
    const alert = this.alertCtrl.create({
        title: 'New Friend!',
        subTitle: 'Your friend, Obi wan Kenobi, just accepted your friend request!',
        buttons: ['OK']
    });
    alert.present();
}

}

现在，当收到身份响应时，想显示一个简单的警报！但是根据 API 文档，我在 SplashScreenComponent 中注入了 AlertController 并在构建时发生了以下错误！无法在互联网上搜索任何解决方案。

AlertController Error! No provider for AlertController

SplashScreenComponent 位于 SplashScreen 模块中，这是一个延迟加载的模块。

【问题讨论】：

是 AlertController 是角度服务
@NinjaJami 不！我在这里找到了示例：ionicframework.com/docs/components/#alert，它是一个离子 UI 组件
我认为 AlerController 是 Ionic 的一项服务。你可以在提供者中指定它并尝试吗？
@NinjaJami 试过了，但没有成功！

标签： angular ionic-framework

【解决方案1】：

根据我的要求，我使用了 'ionic-angular's AlertController，@NinjaJami 的回答帮助我更具体地解决了这个问题！

停止使用 'ionic-angular' 并替换，

import {AlertController} from "ionic-angular";

与，

import {AlertController} from "@ionic/angular";

并且，替换，

showAlert() {
    const alert = this.alertCtrl.create({
        title: 'New Friend!',
        subTitle: 'Your friend, Obi wan Kenobi, just accepted your friend request!',
        buttons: ['OK']
    });
    alert.present();
}

与：

showAlert() {
    const alert: any = this.alertCtrl.create({
        title: 'New Friend!',
        subTitle: 'Your friend, Obi wan Kenobi, just accepted your friend request!',
        buttons: ['OK']
    });

    alert.then((_alert: any)=> {
        _alert.present();
    })
}

解释： this.alertCtrl.create()返回一个Promise，所以不能直接调用alert.present()，所以，使用alert.then()可以调用present () 函数。

特别感谢@NinjaJami

【讨论】：

谢谢！帮助使用 import {AlertController} from "@ionic/angular"；和 async presentAlert 从这里ionicframework.com/docs/api/alert。你拯救了我的一天！

【解决方案2】：

确保您已导入 IonicModule

 imports:      [ IonicModule.forRoot(),BrowserModule, FormsModule ],

工作演示

https://stackblitz.com/edit/ionic-error?file=src/app/app.component.ts

【讨论】：

我已经在使用 IonicModule.forRoot()，但无法使用 ionic-angular 获得有效的解决方案。最后经过一些调整，能够使其工作！我将分享我的解决方案作为答案。