Click here to Skip to main content
15,436,489 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
I work on angular 9 I face issue when add angular material auto complete text box

TypeScript
error NG8003: No directive found with exportAs 'matAutocomplete'.
 <mat-autocomplete #auto="matAutocomplete" [panelWidth]="auto" (optionSelected)='getchangedoption($event.option.value)'>

      <mat-autocomplete #auto="matAutocomplete" [panelWidth]="auto" (optionSelected)='getchangedoption($event.option.value)'>



auto complete component.html

TypeScript
<mat-form-field >
  <input type="text" placeholder="Select Item" aria-label="Number" matInput [formControl]="myControl" [matAutocomplete]="auto" class="form-control" [(ngModel)]="selectedItemName">
  
  <mat-autocomplete #auto="matAutocomplete" [panelWidth]="auto" (optionSelected)='getchangedoption($event.option.value)'>
    <mat-option (click)="getselected(exp.itemName,i+1,exp.id)" *ngFor="let exp of this.filteredOptions | async;let i = index" [value]="exp.itemName">
      {{exp.itemName}}
    </mat-option>
  </mat-autocomplete>
</mat-form-field>


current Packages Exist on angular project is :

TypeScript
"@agm/core": "^1.1.0",
    "@amcharts/amcharts4": "^4.9.26",
    "@amcharts/amcharts4-geodata": "^4.1.15",
    "@angular/animations": "^9.1.13",
    "@angular/cdk": "^12.1.1",
    "@angular/common": "~9.0.0",
    "@angular/compiler": "~9.0.0",
    "@angular/core": "~9.0.0",
    "@angular/forms": "~9.0.0",
    "@angular/localize": "^9.0.0",
    "@angular/material": "^11.2.13"


so How to solve this issue please ?

What I have tried:

I try to add lines below to app.module to solve issue but issue still exist

import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatFormFieldModule } from '@angular/material/form-field';
 imports: [
   FormsModule,
    MatFormFieldModule,
Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900