0

场景：我在Angular7项目 ( https://stackblitz.com/edit/angular-efdcyc ) 上运行一个非常基本的测试，该项目还在“@angular/cdk/scrolling”中使用ScrollingModule 。

问题：有什么办法可以解决下面的错误吗？我错过了什么吗？

我的spec.ts文件中的简单测试

import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';

describe('AppComponent', () => {
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [
        AppComponent
        ,countriesComponent
      ],
    }).compileComponents();
  }));

  it('should create the app', () => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.debugElement.componentInstance;
    expect(app).toBeTruthy();
  });
});

错误：

错误：模板解析错误：无法绑定到“cdkVirtualForOf”，因为它不是“div”的已知属性。("

<cdk-virtual-scroll-viewport itemSize="10" class="example-viewport">
        <div \[ERROR ->\]*cdkVirtualFor="let item of myList" class="example-item">{{item.name}} ({{item.code}})</div>
</c"): ng:///DynamicTestModule/countriesComponent.html@13:17 Property binding cdkVirtualForOf not used by any directive on an

嵌入式模板。确保属性名称拼写正确，并且所有指令都列在“@NgModule.declarations”中。("

<cdk-virtual-scroll-viewport itemSize="10" class="example-viewport">
        \[ERROR ->\]<div *cdkVirtualFor="let item of myList" class="example-item">{{item.name}} ({{item.code}})</div>   "):

ng:///DynamicTestModule/countriesComponent.html@13:12 'cdk-virtual-scroll-viewport' 不是已知元素： 1. 如果 'cdk-virtual-scroll-viewport' 是 Angular 组件，则验证它是否是这个模块的一部分。2. 如果“cdk-virtual-scroll-viewport”是一个 Web 组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以禁止显示此消息。(" 

\[ERROR ->\]<cdk-virtual-scroll-viewport itemSize="10" class="example-viewport">
        <div *cdkVirtualFor"): ng:///DynamicTestModule/countriesComponent.html@12:4
at syntaxError (http://localhost:9876/node_modules/@angular/compiler/fesm5/compiler.js?:1021:1)
at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse

( http://localhost:9876/node_modules/@angular/compiler/fesm5/compiler.js?:14851:1 ) 在 JitCompiler.push ../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate ( http://localhost:9876/node_modules/@angular/compiler/fesm5/compiler.js?:24570:1 ) 在 JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate ( http://localhost:9876/node_modules/@angular/compiler/fesm5/compiler.js?:24557:1 ) 在http://localhost:9876/node_modules/@angular/compiler/fesm5/compiler.js?: 24500:48 在 Set.forEach () 在 JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (http://localhost:9876/node_modules/@angular/compiler/fesm5/compiler.js?:24500:1）在http://localhost:9876/node_modules/@angular/compiler/fesm5/compiler.js?:24418 :1 在 Object.then ( http://localhost:9876/node_modules/@angular/compiler/fesm5/compiler.js?:1012:33 ) 在 JitCompiler.push ../node_modules/@angular/compiler/fesm5/compiler .js.JitCompiler._compileModuleAndAllComponents ( http://localhost:9876/node_modules/@angular/compiler/fesm5/compiler.js?:24416:1 )

无法绑定到“cdkVirtualForOf”，因为它不是“div”的已知属性

4

1 回答 1

2

在您的测试平台中导入模块。

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

TestBed.configureTestingModule({
  declarations: [
    AppComponent
    ,countriesComponent
  ], imports: [ScrollDispatchModule]
}).compileComponents();

但是话又说回来，文档可以解释这一点。

于 2018-12-07T11:39:56.090 回答