Questions tagged [mat-autocomplete]

Autocomplete component for Angular Material. Use for this Material for angular 2+ (i.e., `@angular/material/autocomplete`).

https://material.angular.io/components/autocomplete

144 questions
1
vote
1 answer

mat-autocomplete option not selected

I have an input form with an autocomplete. It filters options as the user types. The problem is that when an option is clicked, the field goes blank instead of it being populated with the user's selection. Here is my HTML:
1
vote
2 answers

Refer to autocomplete inputs generated dynamically with ngFor loop

I'm setting an invoice Angular page where lines are added dynamically, every line should have an own autocomplete input with other different inputs.How can i refer to each autocomplete input independently inside my component so i can use the right…
AmYne Gaïeb
  • 130
  • 3
  • 13
1
vote
1 answer

How to set filter with mat auto select in angular template driven form

How to set filter with mat auto select in angular template driven form.
Bharat Chauhan
  • 3,204
  • 5
  • 39
  • 52
1
vote
1 answer

how to open mat-autocomplete panel on the 'optionSelected' event of another mat-autocomplete?

how to open mat-autocomplete panel on the (option-Selected) event of another mat-autocomplete please refer the example here https://stackblitz.com/edit/angular-material-autocomplete-mqnxp5
1
vote
1 answer

Cascaded Angular Material Design sample (with reactive forms)

Any good demo/sample showing how to cascade multiple angular mat-autocomplete controls? All the references I've seen only show one standalone autocomplete. I need to link two controls (possibly three) using reactive forms. A good similar sample…
Alex
  • 285
  • 4
  • 11
1
vote
0 answers

Search table based on selected mat-autocomplete value in angular 6

I have two mat-autocomplete view in my page. For this i am using this angular material example. https://stackblitz.com/angular/lnnnrgqxjmd?file=app%2Fautocomplete-overview-example.ts This same example i am using. In the same page i have a table.for…
ananya
  • 1,001
  • 6
  • 33
  • 50
1
vote
1 answer

Angular materialAutoComplete field service call pulls data slower than user types in

this.filteredContact = this.contactControl.valueChanges.pipe( startWith(''), debounceTime(200), map(val => this.filterContact(val)) ); filterContact(val: string): any { if (val.length > 2) { return _.filter( …
Sundar
  • 655
  • 2
  • 7
  • 13
1
vote
0 answers

Unable to map autocomplete valueChanges with Cloud Firestore database

I am using material autocomplete in a project but unlike their example, I'm pulling from cloud firestore database (beta). I previously set up a service to handle retrieving the data from json server and this worked fine. ngOnInit() { …
mduve
  • 143
  • 1
  • 3
  • 9
1
vote
1 answer

angular material mat-autocomplete issues

i am having a input box with mat-autocomplete. there is a search button that i hit to get the matching entries to populate the suggestions. Though overall it works but the behavior is bit annoying. This is what happens: I type ra and hit…
Vik
  • 8,721
  • 27
  • 83
  • 168
0
votes
0 answers

How to use ngx-infinite-scroll in mat-autocomplete

I want to use ngx-infinite-scroll in mat-autocomplete but seems that it does not triggered scrolled event when scroll bar reach to the end of mat autocomplete panel. What I tried: complete code is Here
Alireza Ahmadi
  • 8,579
  • 5
  • 15
  • 42
0
votes
0 answers

In angular, mat-autocomplete won't close on click outside when opened in mat-dialog

I am working with form inside mat-dialog and i have problem with closing mat-autocomplete dropdown when clicked outside. I have mat-select implemented the sam way and he is working properly. Here is my implementation for both elements Autocomplete …
0
votes
0 answers

Transition does not work in mat-autocomplete in angular to have expandable search box

I implemented search box with mat autocomplete angular material. But when I want to set animation for my search box, It does not work. I want That when I click on search Icon, It opens autocomplete search box . And when I click on search icon in…
0
votes
0 answers

Setting mat-autocomple value with values as objects and displayWith

I'm using mat-autocomplete in order to select an item. I'm populating the list with objects, so I have my label
gnc
  • 41
  • 7
0
votes
0 answers

Angular Material mat-autocomplete not visible in Browser area

I have the problem that I have a small autocomplete field on the far right, but the text is so long that it goes outside the visible area of the browser. How can I force the overlay to align to the left? enter image description here No Idea at the…