Сбой теста Жасмин / Карма из-за виртуальной прокрутки на Angular7 - PullRequest
Новая
       17

Сбой теста Жасмин / Карма из-за виртуальной прокрутки на Angular7

0 голосов
/ 07 декабря 2018

Сценарий : я выполняю очень простой тест для проекта Angular7 (https://stackblitz.com/edit/angular-efdcyc), который также использует ScrollingModule в пределах '@ angular / cdk/scrolling'.

Вопрос : Есть ли какая-либо ошибка, описанная ниже? Я что-то упускаю?

Простой тест в моем spec.ts file 

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' являетсяугловой компонент, затем убедитесь, что он является частью этого модуля 2. Если 'cdk-virtual-scroll-viewport' является веб-компонентом, то добавьте '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)

Can't bind to 'cdkVirtualForOf' since it isn't a known property of 'div'

1 Ответ

0 голосов
/ 07 декабря 2018

Импортируйте модуль в свой тестовый стенд.

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

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

Но опять же, документация есть, чтобы объяснить это.

...