The Dark Knight
The Dark Knight

Reputation: 5585

Why Angular2 says Component is not defined though it's present there?

My app.component.ts :

import {Component} from 'angular2/core';
import {CoursesComponent} from './courses.component';

@Component({
    selector: 'my-app',
    template: '<h1>Hello Angular 2</h1><courses></courses>',
    directives: [CoursesComponent] 
})
export class AppComponent { } 

My courses.component.ts :

   import {component} from 'angular2/core';

   @Component({
    selector : 'courses',
    template : '<h2>Courses</h2>'
   })
   export class CoursesComponent{

   }

Though all the details are there I am not sure why still chromebug says that "component is not defined" .

The error is :

ReferenceError: Component is not defined
    Error loading http://localhost:3000/app/boot.js
    at eval (courses.component.ts:3)
    at execute (courses.component.ts:7)
    at ensureEvaluated (system.src.js:3186)
    at ensureEvaluated (system.src.js:3178)
    at ensureEvaluated (system.src.js:3178)
    at Object.execute (system.src.js:3304)
    at doDynamicExecute (system.src.js:703)
    at link (system.src.js:905)
    at doLink (system.src.js:557)
    at updateLinkSetOnLoad (system.src.js:605)

Any help is greatly appreciated .

Upvotes: 1

Views: 600

Answers (2)

Nach
Nach

Reputation: 304

In courses.component.ts you have the next code line:

 import {component} from 'angular2/core';

And it should be

 import {Component} from 'angular2/core';

You are using @Component which could not be resolved if you don't import it.

Upvotes: 1

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657108

directives in @Component() are deprecated since 2.0.0 beta.6.
Register them in @NgModule() instead

@Component({
    ...,
    directives: [CoursesComponent] 
})

you need to add it to

@NgModule({
    declaration: [CoursesComponent],
    ...
})

Upvotes: 2

Related Questions