Uncaught Error: Could not compile HighlightDirective because it is not a component

Question

错误日志：

runtime_compiler.js:353Uncaught Error: Could not compile 'HighlightDirective' because it is not a component.assertComponent
...

指令：

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


@Directive({
  selector: '[dirHighlight]'
})
export class HighlightDirective {

  constructor(private elementRef: ElementRef, private renderer :Renderer) {

  //this.elementRef.nativeElement.style.backgroundColor = 'green';
    this.renderer.setElementStyle(this.elementRef.nativeElement,'background-color', 'green');
  }

}

Html 文件:

<h2> Custom Attribute Directive</h2>
<div dirHighlight> Some thing</div>

app.component.ts

import { Component } from '@angular/core';
import { HighlightDirective } from './highlight.directive';

@Component({
  selector: 'dir-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  entryComponents:[HighlightDirective],

})
export class AppComponent {

}

Answer 1

您需要在现有的主模块中添加指令，而不是 entryComponents

import { HighlightDirective } from './highlight.directive';

@NgModule({
  imports: [ BrowserModule ],
  declarations: [
    AppComponent,
    HighlightDirective
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

查看文档here

希望对您有所帮助！！

Uncaught Error: Could not compile HighlightDirective because it is not a component

Uncaught Error: Could not compile HighlightDirective because it is not a component

angular2-directives

angular2-components

angular