Question

我正在尝试从另一个模式对话框中打开一个模式对话框，通过在网上搜索，我可以看到人们以前确实没有问题，但是似乎无法正常工作。

当我尝试从第一个模态组件创建第二个模态组件时，它说：

TypeError：this.modal.create不是函数

这是我的代码（包含相关部分）。

Component.module.ts

@NgModule({
  declarations: [
    QuizResultComponent,
    AnswerRecapComponent
  ],
  imports: [CommonModule, FormsModule, IonicModule, FontAwesomeModule],
  exports: [
    QuizResultComponent,
    AnswerRecapComponent
  ],
  entryComponents: [
    QuizResultComponent,
    AnswerRecapComponent
  ]
})
export class ComponentsModule {}

这是我打开第一个模态的方法： Exam.page.ts

... 
export class ExamPage implements OnInit {

    ...

    constructor(
        private router: Router,
        private modal: ModalController
    ) {}

    ...

    async openModal(){
        // Creating the result modal
        const modal = await this.modal.create({
        component: QuizResultComponent,
        componentProps: {
            type: 'exam'
        }
        });

        // Registering back to menu event after dismiss
        modal.onDidDismiss().then(_ => this.router.navigate(['/menu']));

        // Showing modal
        return await modal.present();
    }

    ...

}

这是来自 quiz-result.component.ts 的第二个模式，其中引发了异常。

... 
export class QuizResultComponent implements OnInit {

    ...

    constructor(
    private modal: ModalController,
    private navParams: NavParams
  ) {}

    ...

    async openAnswerRecap(q) {
        const modal = await this.modal.create({ // This line throws the exception.
            component: AnswerRecapComponent,
            componentProps: {
                question: q.question
            }
        });

        return await modal.present();
    }

    ...

}

我真的看不到这段代码有什么问题，是否有什么阻止我从另一个模式组件中打开模式？

Answer 1

就我而言，我在第二个模式控制器上在构造函数上创建了不同的名称，例如：

第一个模式：构造函数（私有模式：ModalController）第二模态：构造函数（private _modal：ModalController）

并为2个模态添加模块entryPoint。

Answer 2

要记住的是，Ionic v4中的模式只是一个组件，而不是页面。

我使用它的方法是在共享模块中导入两个模式（声明，导出和entryComponents），然后在显示它们的父页面模块中导入该模式。类似于OP所做的。

我还删除了cli默认生成的模块（如果您做了ionic g page sampleModal）。

Answer 3

我也遇到过同样的问题，有一种解决方法。让我们假设您有三到四个模型窗口，您必须像链条一样一个接一个地调用。您必须为每个窗口都具有ok或next按钮，在click方法上调用两个事件，例如 Onclick =创建（）：关闭方法

Answer 4

我遇到了同样的情况，是这样解决的：

您需要在 AnswerRecapModule 上导入 QuizResultModule。

@NgModule({
  declarations: [...],
  imports: [
    ....

    AnswerRecapModule

  ],
})
export class QuizResultModule { }

如果两者都没有模块，请创建它。

此外：@Luiz Carlos 也需要回答，在 QuizResultComponent 上创建两个 ModalController

export class QuizResultComponent implements OnInit {

    ...

    constructor(
    private QuizModal: ModalController,
    private AnswerModal: ModalController,

    private navParams: NavParams
  ) {}

其中 QuizModal 用于关闭当前模态，AnswerModal 用于创建 AnswerRecapComponent

另一个模态中的离子4打开模态：modal.create（）不是函数

4 个答案: