不使用响应数据的虚拟滚动-cdk-虚拟滚动-视图端口

Question

我无法将cdk虚拟滚动视图端口与我的角度html中的数据绑定。

这是我的jobLists数组中的数据，该数组与ngOnInit中的响应数据一起分配。

​

​

在我的html类中，我有这样的示例

<cdk-virtual-scroll-viewport itemSize="50">
<div *cdkVirtualFor="let currentJob of jobLists">
  <mat-card class="job-list">
    <div class="posted-on">
      <span class="loc">Posted On</span>: {{ currentJob.posteddate }}
    </div>
         
  </mat-card>
</div>

我已经进口了

 import { ScrollingModule } from '@angular/cdk/scrolling';

在我的appmodule.ts里

我查过project.json CDK已经在那里了。

当我尝试使用normal *ngFor进行显示时，ngFor值将显示，不会出现任何问题。

我还有什么要补充的吗？

更新

当我试图简单地用10000显示数字时，它的出现是正确的。所以它看起来像是绑定值的问题。你知道我的价值有什么问题吗？

更新2

我认为它与itemSize="100“style=”高度:900 my；overflow:auto；“现在它来了，我修改了我的.ts。

jobToDisplay:任何；像这样给它下线并分配

this.jobToDisplay = this.jobLists；

现在它的绑定了，但当我触摸到高度属性时，它就不会绑定。

Answer 1

更改列表或页高时，必须将固定高度定义为css规则，以控制视口大小。

this.cdkVirtualScrollViewport? .checkViewportSize ()

哪里

@ViewChild (CdkVirtualScrollViewport, {static: false}) cdkVirtualScrollViewport: CdkVirtualScrollViewport