如何解决循环依赖关系(服务)

时间:2019-06-03 09:32:50

标签: angular ionic-framework

我在两个组件之间有循环依赖。我知道这是事实,而且我还有一些额外的保护措施来防止出现这种情况。但是,在编译时我无法关闭通知。

我有一个聊天应用,发生了圈子,是因为您可以从home组件中打开profile组件。在profile组件中,您可以选择向他们发送文本消息,现在当您在chat组件中时,可以单击其头像,这将打开个人资料组件。 进入此圈子的另一种方法是,当您导航到聊天选项卡并单击您要发消息的人,然后单击其头像并打开个人资料组件时,如果单击“发送消息”,则会打开{{ 1}}组件

我所做的是监视他们如何访问页面,如果您从chat组件访问profile组件,则无需打开chat组件,而是关闭个人资料背部。效果很好,但是,此循环依赖警告很烦人。

有没有办法防止这种循环依赖?如果没有,该如何关闭警告?

home.component

chat

profile.component / html

this.modalService.openProfile(doctor, ProfileComponent); 

聊天组件

public async openChat(ev: any) {
  this.modalService.openChat(this.contact, ChatComponent); //pass reference
}

 <ng-container *ngIf="sentFrom === 'chat'; else homePage ">
      <ion-button (click)="closeProfile()" color="primary" slot="start"><ion-icon name="paper-plane"></ion-icon>Enviar Mensaje</ion-button>    
    </ng-container>
    <ng-template #homePage>
      <ion-button (click)="openChat()" color="primary" slot="start"><ion-icon name="paper-plane"></ion-icon>Enviar Mensaje</ion-button>    
    </ng-template>

模态服务

public async openProfile() {
  this.modalService.openProfile(this.contact, ProfileComponent); 
}
//similar guard on the HTML page
import { ModalController } from '@ionic/angular';

@Injectable({
  providedIn: 'root'
})
export class ModalService {

  constructor(private modalCtrl: ModalController) {}

  public async openChat(contact: Contact, modal: any) {
    const chat = await this.modalCtrl.create({
      component: modal,
      animated: true,
      componentProps: {contact}
    });
    return await chat.present();
  }

  public async openProfile(contact: Contact, modal: any) { 
    const profile = await this.modalCtrl.create({
      component: modal,
      animated: true,
      componentProps: {contact}
    });
    return await profile.present();
  }
  public dismiss() {
    return this.modalCtrl.dismiss();
  }
}

0 个答案:

没有答案