时间戳

首页 > 解决方案 > 在组件中检测到角度循环依赖

angular - 在组件中检测到角度循环依赖

问题描述

我有 2 个组件，每个组件都需要导入其他组件。导入时会在终端“检测到循环依赖”中发出警告。

我的组件代码如下：

组件 1

import { ReservationDateInfoComponent } from 'app/modules/reservation-date-info.component';

    export class RateInfoComponent implements OnInit {

      constructor(private dialog: MatDialog){}

      openDateInfo(){
        this.dialog.open(ReservationDateInfoComponent, { width: '1000px'});
      }


    }

组件 2

import { RateInfoComponent } from '../../../core/shared/components/rate-info/rate-info.component';

export class ReservationDateInfoComponent implements OnInit {
  constructor(private dialog: MatDialog){}

  openRateInfo(){
    this.dialog.open(RateInfoComponent, { width: '1000px'});
  }
}

标签： angular

解决方案

循环依赖显然出现了，因为在ReservationDateInfoComponent中您导入了RateInfoComponent，即再次导入了ReservationDateInfoComponent。

以下描述了您的圈子：

RateInfoComponent -> ReservationDateInfoComponent -> RateInfoComponent ....

可能的解决方案

并且附加组件可以导入所有需要的模态并连续显示它们。听起来您还需要在模态组件之间传输数据。这可以通过使用Observables来实现。这样，您的第三个组件应该订阅每个模式以获取其数据。

推荐阅读