使用模态实用工具类避免循环依赖？

Question

我有一个utilities类，它在我的应用程序中处理一些常见的事情，比如显示警报、加载旋转器和调制解调器。现在，在我的主页上，我试图调用utilities.openModal()，但是得到了一个循环依赖项，其中包含以下警告消息：

在循环依赖项中检测到ng警告： ng src/app/pages/users/add-entry/add-entry.page.ts -> src/app/services/utilities/utilities.service.ts -> src/app/pages/users/add-entry/add-entry.page.ts 在循环依赖项中检测到ng警告： ng src/app/services/utilities/utilities.service.ts -> src/app/pages/users/add-entry/add-entry.page.ts -> src/app/services/utilities/utilities.service.ts

openModal函数在utilities.service.ts上：

openModal(page, enterAnimation = null, leaveAnimation = null) {
  // Create modal
  this.modalCtrl.create({
    component: page,
    enterAnimation: enterAnimation,
    leaveAnimation: leaveAnimation,
    componentProps: {
      utilities: UtilitiesService
    }
  }).then(m => m.present());
}

openEntryModal() {
  this.openModal(AddEntryPage);
}

我只需使用this.utilities.openEntryModal()在我的主页组件上调用它，一旦模式打开，它就会抛出循环依赖项警告。知道为什么会这样吗？我有一个粗略的想法，但不能准确地指出。

add-entry.page.ts导入：

import { Component } from '@angular/core';
import { UtilitiesService } from 'src/app/services/utilities/utilities.service';

utilities.service.ts进口：

import { Injectable } from '@angular/core';
import { ModalController, LoadingController } from '@ionic/angular';
import { AnimationsService } from 'src/app/services/animations/animations.service';
import { AddEntryPage } from 'src/app/pages/users/add-entry/add-entry.page';

Answer 1

这意味着在utilities.service.ts中导入了AddEntryPage，在add-entry.page.ts中导入了UtilitiesService，这将导致循环依赖。

基于您的代码，您似乎希望从AddEntryPage (导入服务)中打开AddEntryPage组件的模式。

如果您为其他函数导入了服务，最好分解该服务，例如创建另一个名为modalService的服务