Angular 6 Karma Test '@input decorator - PullRequest
       8

Angular 6 Karma Test '@input decorator

0 голосов
/ 17 октября 2018

В AppComponent я использую компонент nav в коде HTML.Пользовательский интерфейс выглядит хорошо.Нет ошибок при выполнении ng serve.и нет ошибок в консоли, когда я смотрю на приложение.Но когда я запустил Karma для моего проекта, возникла ошибка:

Ошибка:

Failed: Template parse errors:
Can't bind to 'head' since it isn't a known property of 'app-widget'.
1. If 'app-widget' is an Angular component and it has 'head' input, then verify that it is part of this module.
2. If 'app-widget' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("<app-widget [ERROR ->][head]="heading"></app-widget>

Spec.ts:

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { HomeService } from './../../service/home.service';
import { MyFavoriteComponent } from './my-favorite.component';

describe('MyFavoriteComponent', () => {
  let component: MyFavoriteComponent;
  let fixture: ComponentFixture<MyFavoriteComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ MyFavoriteComponent ],
      providers: [{provide: HomeService}]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(MyFavoriteComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

TS:

import { Component, OnInit, Input } from '@angular/core';
import { HomeService } from './../../service/home.service';

@Component({
  selector: 'app-my-favorite',
  templateUrl: './my-favorite.component.html',
  styleUrls: ['./my-favorite.component.scss']
})
export class MyFavoriteComponent implements OnInit {
  heading = '';
  constructor(private homeService: HomeService) {}

   ngOnInit() {
    this.homeService.homeDataWidget().subscribe(response => {
      this.heading = response.myfavoirte;
    });

   }

}

HTML

<app-widget [head]="heading"></app-widget>

1 Ответ

0 голосов
/ 17 октября 2018

Ваш компонент, вероятно, использует app-widget.Вы должны добавить его к «объявлению» (если это компонент) или к «импорту» (если это модуль) в вашем тесте.

Второй способ - это добавить «NO_ERRORS_SCHEMA»:

TestBed.configureTestingModule({
      imports: [FormsModule],
      declarations: [ MyFavoriteComponent, WidgetComponent],
      providers: [{provide: HomeService}],
      schemas: [NO_ERRORS_SCHEMA]
    })
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...