CODEWITHSUNDEEP
angulartypescriptdata-bindingcomponents
Mahdi Ta'ala
Mahdi Ta'ala

Reputation: 380

Angular 2 Error ( 'directives' does not exist in type 'Component' )

I am beginner in Angular 2 and I'm using the final Angular 2 release version. I have a strange problem with it. this is my databinding.component.ts code:

import { Component } from '@angular/core';

import {PropertyBindingComponent} from './property-binding.component';
import {EventBindingComponent} from './event-binding.component';


@Component({
  selector: 'fa-databinding',
  templateUrl: 'databinding.component.html',
  styleUrls: ['databinding.component.css'],
  directives: [PropertyBindingComponent, EventBindingComponent]
})

and this is a peace of my app.module.ts code :

import { PropertyBindingComponent } from './databinding/property-binding.component';
import { EventBindingComponent } from './databinding/event-binding.component';

@NgModule({
  declarations: [
    AppComponent,
    OtherComponent,
    AnotherComponent,
    DatabindingComponent,
    PropertyBindingComponent,
    EventBindingComponent
  ]

This code does not work correctly:

ERROR in [default] /home/tornado/work/first-app/src/app/databinding/databinding.component.ts:11:2 
Argument of type '{ selector: string; template: any; styles: any[]; directives: (typeof PropertyBindingComponent | ...' is not assignable to parameter of type 'Component'.
  Object literal may only specify known properties, and 'directives' does not exist in type 'Component'.

What should I do?!?!

Upvotes: 13

Views: 25129

Answers (3)

Srinivasan N
Srinivasan N

Reputation: 683

Add directive component in app.module.ts

import { CopyTextDirective } from './shared/directives/copy-text.directive';

@NgModule({
  declarations: [
CopyTextDirective
]
})

include the directive directly in your component,

<div appCopyText></div>

appCopyText - selector in directive component copy-text.directive.ts.

Upvotes: 0

avantdev
avantdev

Reputation: 2724

I encountered that case and solved. As directives, you don't need to import and plug them to specific component. You could use them like this.

First, import them on the app.module.ts. Second, add imported directive into declarations. Then they would be working.

Upvotes: 0

Simon K
Simon K

Reputation: 2857

directives was removed from component. See the following: https://stackoverflow.com/a/39410642/5487673

The solution to the problem is simply to remove the directives attribute from your component. So long as the components listed under your directives attribute are declared at the NgModule level then you should be right.

Upvotes: 21

Related Questions