Testing directive in Angular 2 + Jasmine I am getting an error

梦想的初衷 提交于 2019-12-12 05:19:11

问题


I am getting the error below when I run the test using Angular 2 + Jasmine. Does anyone know how can I solve this problem?

I already have imported the directive in app.module.ts.

Can't bind to 'highlightData' since it isn't a known property of 'li'. ("[ERROR ->][highlightData]="item.name">

list.component.ts

<ul>
    <li *ngFor="let item of list" [highlightData]="item.name">{{item.name}}</li>
</ul>

highlight-data.directive.ts

import { Directive, SimpleChanges, Input, OnChanges, ElementRef, Renderer} from '@angular/core';

@Directive({
  selector: '[highlightData]'
})
export class HighlightDataDirective implements OnChanges {
  private _highlightData: string;

  @Input() set highlightData(value: string) {
    const prev = this._highlightData;
    this._highlightData = value;
    const cur = value;
  }

  constructor(private _elementRef: ElementRef, private _render: Renderer) {

  }

  ngOnChanges(changes: SimpleChanges) {
    if (changes['highlightData'] && !changes['highlightData'].isFirstChange()) {
      const prev: string = changes['highlightData'].previousValue;
      const cur: string = changes['highlightData'].currentValue;

      if (cur !== prev) {
        this._render.setElementClass(this._elementRef.nativeElement, 'animate', true);

        setTimeout(() => {
          this._render.setElementClass(this._elementRef.nativeElement, 'animate', false);
        }, 3000);
      }
    }
  }

}

Thanks.

来源:https://stackoverflow.com/questions/44463088/testing-directive-in-angular-2-jasmine-i-am-getting-an-error

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!