Uncaught Reference Input ist nicht definiert - @Input() funktioniert nicht in Angular 2

Question

Ich bin ein Neuling versucht Angular2 von ng-Buch 2 (v49) zu lernen. Hier werden die Inhalte von article.componenets.ts Datei:

import { Component, OnInit } from '@angular/core'; 
import { Article } from './article.model'; 

@Component({ 
    selector: 'app-article', 
    templateUrl: './article.component.html', 
styleUrls: ['./article.component.css'], 
host: { 
class: 'row' 
} 
}) 
export class ArticleComponent implements OnInit { 
    @Input() article: Article; 



    voteUp(): boolean { 
    this.article.voteUp(); 
    return false; 
    } 

    voteDown(): boolean { 
    this.article.voteDown(); 
    return false; 
    } 

    ngOnInit() { 
    } 

} 

Hier ist der Fehler auf dem Winkel-cli:

ERROR in C:/Users/saad/Desktop/books/Angular JS2/angular2Reddit/src/app/article/article.component.ts (13,4): Cannot find name 'Input'.) 
webpack: Failed to compile. 

Answer 1

Sie fehlen Import für die Eingabe-Direktive, ändern Sie also die erste Zeile als

import { Component, OnInit, Input } from '@angular/core'; 

Es ist gute Praxis, die @Input Parameter mit einem gewissen Wert haben sonst werden Sie am Ende Unhandle Versprechen Fehler einige, wo in Ihrer Anwendung zu bekommen.

Dafür kann es in Ihrem ngOnInit oder Konstruktor

ngOnInit() { 
    this.article={ 
     id: 0 
     ..... 
    }; 
} 

oder

constructor(....) { 
    this.article={ 
     id: 0, 
     ..... 
    }; 
} 

Answer 2

Sie haben Eingang zu importieren, wenn Sie möchten, Verwenden Sie es:

import { Component, OnInit, Input } from '@angular/core';