Круговые зависимости в ионном приложении - PullRequest
Новая
       8

Круговые зависимости в ионном приложении

0 голосов
/ 29 января 2019

У меня было приложение Ionic 3, которое мне нужно обновить до Ionic 4. В этой миграции некоторые циклические зависимости стали проблематичными, и мне интересно, как лучше их разрешить.

Мне удается разрешить все остальные, но у меня есть проблемы с этими двумя:

  • Страница вызывает провайдера, и в провайдере у меня есть функция, которая отображает модальные с этой страницейв качестве компонента

=> FooProvider импортирует myPage, а myPage импортирует FooProvider

FooProvider 

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

mypage 

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

, который я мог бы создатьmodalProvider, который принимает аргумент в виде строки и отправляет нужную страницу, но выглядит как уродливые уловки, а провайдер ModalController уже определен Ionic.

- EDIT Перенес другие циклические зависимости в другой вопрос

есть идеи о том, как лучше всего избегать подобных циклических зависимостей?

спасибо заранее

1 Ответ

0 голосов
/ 29 января 2019

Полезное правило - разделение интересов.

1- Компонент / Страница имеет дело только с отображением материала

2- Поставщик / услуга занимается получением данных или выполняет только тяжелую работу

3- НикогдаИмпортируйте A в B , а затем B в A .Если вы обнаружите, что делаете это, скорее всего, вы не подумали об этом.Повторите попытку, используя правила 1, 2

. Чтобы решить вашу первую проблему, я бы удалил логику представления модала от провайдера и разместил его либо на странице, над которой я работаю (если она очень специфична для этого).стр.) или, поместите эту логику в app.component.ts (если этот модал может быть представлен в различных ситуациях, таких как предупреждение / ошибка / информационное сообщение)

Теперь вашему провайдеру, возможно, все еще потребуется представить некоторую информациючерез модальное право?Так как мы это сделаем?Одним из способов может быть создание modalSubject: Subject

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.

Можете ли вы создать еще один вопрос для вашего второго вопроса, чтобы его могли найти люди с такой же проблемой?

...