joebrinkman-earnin / ng2-typeahead

Autocomplete component for Angular 2
MIT License
32 stars 21 forks source link

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

Open davedastrange opened 7 years ago

davedastrange commented 7 years ago

(" <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 commented 7 years ago

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 commented 7 years ago

@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 commented 7 years ago

@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 commented 7 years ago

@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. :(