Cannot find name +'Input'. any Angular 2

Question

I am trying to get @Input to work with Typescript in Angular 2. I am getting the following error and I don't understand why.

[ts] Cannot find name 'Input'. any

Below is the code from that component.

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

@Component({
   selector: 'app-item',
   templateUrl: './app-item.component.html',
   styleUrls: ['./app-item.component.css']
})
export class AppItemComponent implements OnInit {
      @Input item; //TypeScript complains here. 

      constructor() { }

      ngOnInit() {}
}

The project and component were both created using the Angular CLI. Why can't TypeScript figure out the @Input decoration?

Sajeetharan · Accepted Answer · 2017-04-08 04:06:08Z

44

You need to add this,

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

answered Apr 8, 2017 at 4:06

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user961714 Over a year ago

That did it! Thanks!

Krishnadas PC Over a year ago

Same for Output incase you are using that.

Marcielli Oliveira · Accepted Answer · 2018-11-27 19:26:30Z

3

In my case I already had:

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

So, when I tried to use:

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

It didn't work.

What I had to do was import like that (Without the word Component)

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

And it worked just fine

answered Nov 27, 2018 at 19:26

Marcielli Oliveira

1312 silver badges3 bronze badges

Comments

TheBatman · Accepted Answer · 2018-12-17 16:55:23Z

3

@Marcielli, it didn't work because of the double import of Component. If you change the import statement to the following

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

You would be just fine. Optionally adding the Input module in a separate import statement is perfectly fine, but you should generally stick with either importing all components from a module in one statement, or each in separate statements.

answered Dec 17, 2018 at 16:55

TheBatman

7704 silver badges10 bronze badges

Collectives™ on Stack Overflow

Cannot find name +'Input'. any Angular 2

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related