1

我在我的 ionic 5.3.3 项目中安装了 CDK Virtual Scroller：

npm add @angular/cdk

版本是：“@angular/cdk”：“^13.0.2”

滚动视口包含一个 ion-item-group：

<ng-template #showContentBlock>
    <cdk-virtual-scroll-viewport
            itemSize="56"
            minBufferPx="900"
            maxBufferPx="1350"
            >
          <ion-item-group>
            
             <ion-item-sliding *cdkVirtualFor="let test of tests">
    
            <ion-item class="notification-item" lines="none" >
              <ion-avatar slot="start">
                <img src="./assets/tests/tests6.jpg">
              </ion-avatar>
              <ion-row class="notification-item-wrapper" (click)="openTestModal(test)">
    
                <!-- <ion-col size="1">
                  <app-aspect-ratio [ratio]="{w: 1, h: 1}">
                    <app-image-shell class="notification-image" src="./assets/tests/histology1.jpg" [alt]="'conatct image'"></app-image-shell>
                  </app-aspect-ratio> 
                </ion-col> -->
                  <ion-col class="details-wrapper">
                    <h2 class="details-name">{{test.investigation}}</h2>
                    <p class="details-description">{{test.Lab}}</p>
                  </ion-col>
                  <ion-col size="2" class="date-wrapper">
                    <h3 class="notification-date">{{test.SpecimanType}}</h3>
                  </ion-col> 
              </ion-row>
            </ion-item>
            <ion-item-options slide="end">
              <ion-item-option color="danger" (click) = "removeTest(test.id)">
                <ion-icon name="trash"></ion-icon>
              </ion-item-option>
              <ion-item-option color="success" (click)="updateStudent(test)">
                Edit
              </ion-item-option>
            </ion-item-options>
          </ion-item-sliding>
          </ion-item-group>
        </cdk-virtual-scroll-viewport>

视口 css 属性：

cdk-virtual-scroll-viewport {
    height: 100%;
    width: 100%;
}

当我构建项目时，出现以下错误：

node_modules/@angular/cdk/bidi/directionality.d.ts:22:21 中的错误 - 错误 TS2694：命名空间 '"../User Manual/node_modules/@angular/core/core"' 没有导出成员 'ɵɵFactoryDe​​claration' .

22 静态ɵfac: i0.ɵɵFactoryDe​​claration<Directionality, [{ optional: true; }]>;

这是版本：离子：

离子 CLI：6.16.1 (/usr/local/lib/node_modules/@ionic/cli) 离子框架：@ionic/angular 5.9.1 @angular-devkit/build-angular：0.1001.7 @angular-devkit/schematics： 10.2.3 @angular/cli：10.2.3 @ionic/angular-toolkit：2.3.3

电容器：

电容器 CLI：3.3.2 @capacitor/android：3.3.2 @capacitor/core：3.3.2 @capacitor/ios：3.3.2

效用：

cordova-res（可用更新：0.15.3）：0.15.2 本机运行：1.5.0

系统：

NodeJS：v14.17.0 (/usr/local/bin/node) npm：6.14.15 操作系统：macOS Catalina

我一直在网上搜索，但我不明白错误或如何进一步调试它，任何帮助表示赞赏。

4

1 回答 1

2

看来您的角度是第 10 版：@angular/cli : 10.2.3而 CDK 是第 13 版。让它们同步 - 这类问题往往会消失

于 2021-11-25T21:08:53.527 回答