首页 > 解决方案 > 导入 ResizeObserverModule 时收到“模块本身有错误”错误

问题描述

ResizeObserverModule我正在使用from收听元素的大小@ng-web-apis。一切正常,所以我没有任何问题。但是,我将模块导入到 VSCode 中的红色突出显示中。当我突出显示它时,我看到以下错误

出现在DemonstrationComponentsModule的NgModule.imports中,但本身有错误

然后对数组说了同样的话NgModule.exports,但实际上并没有告诉我错误是什么,它工作得很好。当我第一次尝试它时,我将它导入到AppModule假设它将在全球范围内公开。在了解了我们需要将它导入到我们想要使用它的模块中之后,我将它从 中注释掉并将其AppModule添加到我现在使用它的位置。

当我在模块中将其注释掉时,错误消失了,因此由于将其添加到模块中而发生了一些事情。我遇到此错误的唯一其他时间是,如果我将某些内容导入到AppModule我还导入到另一个模块中,该模块导入到AppModule.

为了符合显示代码的标准,这里是一切的样子。

模块

@NgModule({
  declarations: [
    ResponsiveShellComponent,
  ],
  imports: [
    CommonModule,
    ResizeObserverModule,
    PropertyDisplayModule
  ],
  exports: [
    CommonModule,
    ResizeObserverModule,
    PropertyDisplayModule,
    ResponsiveShellComponent
  ],
  bootstrap:[ResponsiveShellComponent]
}

export class ResponsiveShellModule { }

零件

export class ResponsiveShellComponent implements OnInit, AfterViewInit {
    //omited for relevance

    WindowSize: windowSize = {width: 0, height: 0};

    public sizeListener(entry: ResizeObserverEntry[]):void{
        this.WindowSize = {
          width: Math.floor(entry[0].contentRect.width),
          height: Math.floor(entry[0].contentRect.height)
        };
    }
}

模板

<section class="shell">
    <article>
        <p>{{WindowSize.width}}</p>
        <p>{{WindowSize.height}}</p>
    </article>
    <iframe
        class="iframeShell"
        #compFrame
        waResizeBox="content-box"
        (waResizeObserver)="sizeListener($any($event))"
    ></iframe>
</section>

这是否显示了可能导致错误的原因?

标签: angulartypescript

解决方案


推荐阅读