Stack Overflow
Stack Overflow

Questions tagged [md-autocomplete]

is a special input component with a drop-down of all possible matches to a custom query. This component allows you to provide real-time suggestions as the user types in the input area.

docs

https://material.angularjs.org/latest/api/directive/mdAutocomplete

demo

https://material.angularjs.org/latest/demo/autocomplete

syntax

<md-autocomplete
    md-selected-item="selectedItem"
    md-search-text="searchText"
    md-items="item in getMatches(searchText)"
    md-item-text="item.display">
   <span md-highlight-text="searchText">{{item.display}}</span>
</md-autocomplete>

screenshot

enter image description here

131 questions
0
votes
4 answers

Angular material css md-autocomplete :focus

I'm trying to use :focus on md-autocomplete to change the background color when the user press Keydown or Keyup. It's work fine with :hover for the mouse : md-autocomplete-parent-scope:hover{ color: rgb(63, 92, 154); } but not with…
J. Hany
  • 1
  • 1
0
votes
1 answer

Angular material md-chips md-autocomplete

How do you prevent the input line from expanding when you add multiple chips. I've tried setting the flex and width but it ends up pushing the input line downwards. I've also tried setting it to absolute but that completely messed up the alignment.…
Flash
  • 924
  • 3
  • 22
  • 44
0
votes
0 answers

Pass md-on-demand to md-autocomplete

I would like display in md-autocomplete large list (around 50 000 records). Autocomplete directive uses mdVirtualRepeat which provide infinity scrolling. I couldn't find way to pass md-on-demand option. Maybe someone find way to do that. I really…
Rithala
  • 1
  • 1
  • 2
0
votes
1 answer

Manually invoke md-autocomplete dropdown

When the md-autocomplete input box is first clicked, the autocomplete drop-down doesn't appear until the first character is typed. I haven't been able to figure out why the autocomplete isn't showing upon first click, as it shows in the demos. As a…
Nick
  • 1,743
  • 6
  • 23
  • 38
0
votes
1 answer

Angular Material autocomplete no data or not-found-message

My md-autocomplete doesn't show data and the md-not-found data at the same time. angular.module('BlankApp').controller('ctrl', function($scope, $q){ $scope.items = [{name: 'item1', id: 1}, {name: 'item2', id: 2}, {name: 'item3', id: 3}]; …
gerb0n
  • 380
  • 1
  • 5
  • 19
0
votes
2 answers

md-autocomplete ordering dropdown items

I have a md-autocomplete field:
Sjors Hijgenaar
  • 1,232
  • 1
  • 16
  • 30
0
votes
2 answers

AngularJS md-autocomplete search for a string within a string

How do you configure md-autocomplete so that if you search for a word, it searches for strings within strings. At the moment it only finds the first word. As with the demo https://material.angularjs.org/latest/demo/autocomplete, if you type new, it…
skunk
  • 83
  • 1
  • 8
0
votes
1 answer

How to attach a vanilla JavaScript keyup listener to an angular md-autocomplete input using the dom id?

I have an angular md-autocomplete like this: And I want to do this: document.getElementById("myid") .addEventListener("keyup", function(event) { //my code …
Ryan
  • 5,883
  • 13
  • 56
  • 93
0
votes
0 answers

md-autcomplete form populated with contents of another md-autocomplete form?

I have two forms on a web page. One form wraps around a md-autocomplete search bar along with a header on the page; the other around another md-autocompleteentity on the page itself. The forms have different names. However, upon loading the page,…
Harrison
  • 69
  • 9
0
votes
1 answer

How can I "extends" an attribute from directive?

What I'm trying to do or know if it's possible, is extends/share/reuse or anything like this: Passing through my directive an specific attribute that will be used in a tag inside the directive template:
Pablo
  • 1,953
  • 4
  • 28
  • 57
0
votes
1 answer

search query function of md-autocomplete

Angular material documentation for md-autocomplete for tags(md-chips) uses a filter function given below- //Search for vegetables. function querySearch (query) { var results = query ? self.vegetables.filter(createFilterFor(query)) :…
shiv_saz
  • 65
  • 6
0
votes
1 answer

Custom form error validation in Angular-material ng-messages

Autocomplete form field in view:
Jarvis
  • 163
  • 1
  • 13
0
votes
1 answer

Floating level and clear button in md-autocomplete

As https://github.com/angular/material/issues/2727 tells it's not possible to use a floating label and the default clearbutton functionality of angular material together. So what's a clean way to achieve such a behavior, by using a directive?
Niklas Zantner
  • 182
  • 2
  • 16
0
votes
1 answer

md-autocomplete don't wait data from a service. How to resolve?

I want to build a md-autocomplete, but I can not show the options. Always shows the error message that should only be launched when there are no options for the input inserted. My service returns correctly and my controller only return after…
Joao Pinto
  • 7
  • 2
0
votes
2 answers

md-autocomplete disable esc function from raising

the suggestion dropdown disappears when user clicks the input then press esc key. then a weird progress bar keeps cycling.. I need to disable this function
anaval
  • 1,130
  • 10
  • 24
1 2 3
…
8
9