Can't bind to 'list' since it isn't a known property of 'typeahead'

[davedastrange]

("
<typeahead
[(ngModel)]="selectedFruit"
[ERROR ->][list]="fruits"
[searchProperty]="'searchText'" [displayProperty]="'name'"
[maxSuggestions]="2"
"): PortSearchComponent@6:2
Can't bind to 'searchProperty' since it isn't a known property of 'typeahead'. ("
[(ngModel)]="selectedFruit"
[list]="fruits"
[ERROR ->][searchProperty]="'searchText'" [displayProperty]="'name'"
[maxSuggestions]="2"
(suggestionSelect"): PortSearchComponent@7:2
Can't bind to 'displayProperty' since it isn't a known property of 'typeahead'. ("
[(ngModel)]="selectedFruit"
[list]="fruits"
[searchProperty]="'searchText'" [ERROR ->][displayProperty]="'name'"
[maxSuggestions]="2"
(suggestionSelected)="fruitSelected($event)"
"): PortSearchComponent@7:34
Can't bind to 'maxSuggestions' since it isn't a known property of 'typeahead'. ("
[list]="fruits"
[searchProperty]="'searchText'" [displayProperty]="'name'"
[ERROR ->][maxSuggestions]="2"
(suggestionSelected)="fruitSelected($event)"
placeholder="Begin typing a fru"): PortSearchComponent@8:2
'typeahead' is not a known element:

1. If 'typeahead' is an Angular component, then verify that it is part of this module.
2. If 'typeahead' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("

[meetmicah]

I had this issue, and fixed it by adding this to my app.module.ts

import { Typeahead } from 'ng2-typeahead';

And then adding it to my @NgModule declarations:

@NgModule({ declarations: [ Typeahead, ] })

[dipakpurbey]

@meetmicah - when I implemented your solution, I get the following error:

Unexpected value 'Typeahead' declared by the module 'AppModule'. Please add a @Pipe/@Directive/@component annotation.

Any inputs on these ?

[meetmicah]

@dipakpurbey Did you forget to add an '@' somewhere? Similar to this one: https://stackoverflow.com/questions/40363060/angular-2-error-when-declaring-custom-pipe-on-appmodule

[dipakpurbey]

@meetmicah just re-checked. no I have not left it somewhere. Already tested the application by commenting out the typeahead lines in app.module.ts, the app runs fine but when i insert the Typeahead in declarations array of NgModule, the error comes back. :(