typescript - Referință neinclusă Input nu este definită - @Input() nu funcționează în Angular 2


Sunt un începător care încearcă să învețe Angular2 din ng-book 2(v49). Iată conținutul fișierului article.components.ts:

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() {
  }

}

Iată eroarea de la angular-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.

Răspuns #1

Îți lipsește importul pentru directiva Input, așa că schimbă prima linie astfel

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

Este o bună practică ca parametrii @Input să aibă o valoare, altfel vei ajunge să primești Eroare de promisiune netratată undeva în aplicația ta.

Pentru asta poate fi definit în interiorul ngOnInit sau constructor-ului tău

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

sau

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

Răspunsul #2

Trebuie să imporți Input dacă vrei să îl folosești :

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