Stack Overflow
Stack Overflow

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
23
votes
1 answer

Using Angular Material mat-autocomplete without ReactiveForm

I try to use from Angular Material (not AngularJS) without using a reactive form. But all their examples use reactive forms... What I try to do: 1. when something is typed in the mat-input, make an Ajax call to retrieve a list of…
Valentin Coudert
  • 1,759
  • 3
  • 19
  • 44
16
votes
5 answers

Writing unit test for component which uses mat-autocomplete

I am new to Angular, I am trying to build a text field with autocomplete using Angular 5. I found this example in Angular Material docs: https://stackblitz.com/angular/kopqvokeddbq?file=app%2Fautocomplete-overview-example.ts I was wondering how to…
Krishna Chaitanya P
  • 1,274
  • 3
  • 10
  • 19
11
votes
3 answers

mat autocomplete is too slow while loading large data

I am using mat autocomplete https://material.angular.io/components/autocomplete/api in my angular project. while loading large data with 25k items. the performance gets low. it is too slow to search and suggest autocomplete. how to increase the…
venkatesh karthick
  • 335
  • 3
  • 12
10
votes
5 answers

How I can add dropdown arrow within input in mat-autocomplete

I use mat-autocomplete to filter my data. Everything is work but I want to have a dropdown arrow to show all option within the input. In md-autocomplete , we can use dropdown-arrow="true" but in mat-autocomplete is not support it. So how I can add a…
datnguyen94
  • 299
  • 3
  • 5
  • 20
10
votes
2 answers

Angular5 - How to detect empty or deleted field in mat-autocomplete?

This is my html which contains the material autocomplete.
{{filter.columnTitle}} …
Aakash Verma
  • 3,705
  • 5
  • 29
  • 66
9
votes
2 answers

How to save selected object using mat-chip and autocomplete in angular material 2

I am using Angular 6 with Angular Material. I am trying to save a selected object or list of selected object from mat-chip and autocomplete. I am able to send string value to fruits[] array but can not able to send selected object in to fruits[]…
monir tuhin
  • 441
  • 3
  • 13
  • 27
7
votes
2 answers

mat-autocomplete: Need to Reset the List of Options After a Selection is Made

I have a mat-autocomplete component with the options wired up to be populated from a service call as the user types (partial search): …
James Bender
  • 1,175
  • 1
  • 11
  • 22
7
votes
1 answer

How to set value taken from a database as default value for Angular Material Autocomplete

I would like to get a value from a database and set it as a default value in an autocomplete input box. populate clientTypes clientTypes: any[] = []; getClientTypes() { this.clientService.getClientTypes() .subscribe((data: any) => { …
stack questions
  • 862
  • 2
  • 15
  • 29
6
votes
3 answers

How does mat-autocomplete classList Input work?

According to the MatAutocomplete documentation, there is a classList input to style the panel. @Input('class') classList: string | string[] Takes classes set on the host mat-autocomplete element and applies them to the panel inside the overlay…
Pieter Buys
  • 1,280
  • 1
  • 10
  • 20
6
votes
1 answer

How to set default values for mat autocomplete

I have multiple auto complete on a page and able to select values and save them. What I need is when I load the page next time, the pre selected values should be displayed by default for the ones already selected and saved. Following is the code…
a p
  • 1,121
  • 6
  • 26
  • 51
6
votes
3 answers

Must supply a value for form control at index: 1 - Error

I am using Reactive forms with mat autocomplete. I used autocomplete in other parts of my app but i can't figure this out. I have a formarray which adds an input every time I want to add a new sensor in my case. autocomplete works fine in my first…
Aldo Abazi
  • 275
  • 2
  • 5
  • 12
5
votes
1 answer

Is there a way to use a mat-autocomplete where the corresponding input is in its parent component?

This works with a regular datalist element where the list="target" on the input element can find the id="target" in the child component. I am trying to figure out a way to do this with the material autocomplete component. Using a regular datalist…
nsquires
  • 899
  • 2
  • 8
  • 20
5
votes
1 answer

Connecting dynamically generated input field to mat-autocomplete

I am allowing users to create input fields dynamically. For each of these input fields i want to connect it to a different mat-autocomplete so that they work independently of each other. I have hit a brick wall here because I cannot create element…
Vipul Deora
  • 61
  • 1
  • 3
4
votes
1 answer

How do I get the Panel ElementRef of Mat Autocomplete

According to the MatAutocomplete documentation, there is a panel property on MatAutocomplete class that will give you the panel's elementRef. panel: ElementRef Element for the panel containing the autocomplete options. I am struggling to get this…
Pieter Buys
  • 1,280
  • 1
  • 10
  • 20
4
votes
1 answer

Mat-Autocomplete multiple fields

I am using Mat-Autocomplete but for some reason it only works when I am using 1 field, when I add another second field something strange happens. Both on field 1 as in field 2 I get the same options in my dropdown, these options are the options who…
Robin Medland
  • 124
  • 1
  • 4
  • 19
1
2 3
…
9 10