Question

我有一个需要升级到Ionic 4的Ionic 3应用程序。在此迁移中，一些循环依赖项变得有问题，我想知道什么是解决它们的最佳方法。

我设法解决所有其他问题，但是我对这两个问题有疑问：

页面调用提供程序，并且在提供程序中，我有一个函数，用于显示该页面作为组件的模式

=> FooProvider导入myPage，而myPage导入FooProvider

FooProvider

import { myPage} from '../../pages/mypage/mypage';
this.modalCtrl.create({
          component: myPage
});

我的页面

import { FooProvider } ...;
...
constructor(public provider: FooProvider ...) {

我可以创建一个以参数作为字符串的modalProvider，并分派正确的页面，但看起来像个丑陋的把戏，并且Ionic已经定义了一个ModalController。

-EDIT将其他循环依赖项移至另一个问题

关于避免此类循环依赖的最佳做法的任何想法吗？

多谢

Answer 1

有用的经验法则是分离关注点。

1-组件/页面仅处理显示内容

2-提供者/服务负责获取数据，或仅做一些艰苦的工作

3-从不导入 B 中的 A ，然后再导入 A 中的 B 。如果您发现自己正在这样做，则可能是您没有对其进行很好的考虑。使用1条，2条规则重试

要解决您的第一个问题，我将从提供程序中删除呈现模式的逻辑，并将其放在我正在处理的页面上（如果该页面非常特定），或者将该逻辑放入应用程序中.component.ts（如果可以在不同的情况下（例如警告/错误/信息消息）显示此模式）

现在，您的提供者可能仍需要通过模态权利提出一些信息？那么我们该怎么做呢？一种方法是创建 modalSubject：主题

FooProvider

import { ParametreModel } from './../../models/parametre.model';
export class ConnectionServerProvider {
    public parametre: ParametreModel;
    public modalSubject: Subject<ParametreModel> = new Subject<ParametreModel>();
    // ...

    // Then something happens and you need that parameter to sent to the model
    this.parametre = someDataFromSomeWhere;
    this.modalSubject.next(this.parametre);
}

现在在您的页面中（注入FooProvider的地方），您可以订阅该可观察的主题，并使用提供给您的数据展示您的模式：

在mypage.ts或app.component.ts

constructor(private foo: FooProvider) {}
ngOnInit() {
   this.foo.modal.modalSubject.subscribe(
     (param: ParametreModel) => {
          if(!param) {
             yourFunctionThatPresentsTheModalWithParam(param);
          }
     }
   )
}

瞧！

确保您在ngOnDestroy上取消订阅该主题。

您可以为第二个问题创建另一个问题，以便遇到相同问题的人找到它吗？

离子应用中的循环依赖性

1 个答案: