Material: md-item-text of autocomplete cannot be empty

[smileapplications]

Hello everyone,
i'm trying to use a md-autocomplete inside a md-chips. Everything works fine except for when I press Enter on my keyboard or select an option with my mouse, the autocomplete is filled with the md-item-text value and I cannot set it to empty. If i do it the the autocomplete is filled with [Object object].

Why ?

[jozsi]

+1

[typotter]

Is this a duplicate of/similar to #3900? Can you please provide a code example (or better yet, a codepen/plunkr/etc?)

[isyun]

We also run into similar issues in our application. Our application uses an autocomplete box to build a selection list similar to chips but as a customized list above the autocomplete box. In 0.10 release, not setting the md-item-text will clear out the text on select, which is exactly what we want. In 0.10.1, [object Object] is displayed on the autocomplete input on select. This seems to be the string form of the selected item.

Here is a codepen modified from one of the demo to show the problem:
http://codepen.io/anon/pen/NqmdQd

[swalters]

I'm seeing a similar issue. I have a list of values and one value is {name:''}. Choose this item results in the md-autocomplete displaying [object Object]

After more research, I see the issue in autoCompleteController.js:

  function getDisplayValue (item) {
    return $q.when(getItemText(item) || item);

if the ItemText is falsely value, then the item object is returned which results in [object Object] being displayed.

[mihaellenic]

I have the same issue.
What i noticed is that md-autocomplete initially shows [object Object] when my md-item-text value is null, undefined or "", but after focus it shows placeholder as it should in the first place.

edit: here is codepen example: http://codepen.io/mihaellenic/pen/MKbByy?#

[janvandenberg]

+1 For fixing this issue. Now I have to add an extra space in order to avoid this behaviour. But then the placeholder isn't at his correct place.

[swalters]

Any chance of getting this out of backlog soon?

[jobenni]

+1

[martaver]

+1

Also having issues with this. We want the user to be able to select an empty option and fill in the name later. Having an empty value for itemText should be valid.

As @swalters said, this line seems to be the cuplrit:

return $q.when(getItemText(item) || item);

I'm guessing this was done so that the autocomplete could fall back to using the item when, say, a list of pure strings is the data source, instead of a list of objects. But we can already specify whatever expression we want with md-item-text, so this seems more confusing than useful.

So far the only workaround I've found, like @janvandenberg, is to add '\b' when the item is empty which doesn't render in the input box. You can then strip this out later.

[swalters]

@ThomasBurleson Can I ask why you consider this backlogged & deprecated? As of 1.1 RC4, it is still an issue for me.

Is there a workaround aside from hacking my lists not to contain empty strings ?

[martaver]

I'm guessing they're spending more time to focus on the MD implementation for Angular2... :-/

Still, it's frustrating, this seems like it should be an easy problem to fix.

[jayeshanandani]

Refer: Spring Cleaning 2016

[martaver]

Ah cool, thanks Jayesh!

On Fri, Apr 29, 2016 at 11:56 AM Jayesh Anandani [email protected]
wrote:

Refer: Spring Cleaning 2016
https://groups.google.com/forum/#!topic/ngMaterial/3Ip9nd68bfk

—
You are receiving this because you commented.
Reply to this email directly or view it on GitHub
https://github.com/angular/material/issues/3760#issuecomment-215662497

[mschering]

Why was this bug closed? It's still an issue in the latest 1.1 rc4.

[sombriks]

i, too, can confirm the bug is still present. angular-material 1.1.1

[surnamename]

Yep... thats true!
+1

[mcblum]

Still happening to us as well

[ShannonHeylmun]

Hoping this gets resolved soon.
+1

[rainabba]

I thought I'd just hit the same issue, but after forking, tracing and debugging, I came to realize the value used by selectedItem wasn't what I thought (I'd initialized it with a default value, then forgotten) and was an object, but didn't return the empty string I was thinking.

I wonder how many others here are actually dealing with a similar situation? I didn't figure it out until I installed ng-inspector (chrome extension) and looked at the relevant scope.

[bryanrideshark]

I also am running into this issue.

[shayaShav]

Any updates on this? Still broken in v1.1.4!

[asy32x]

this is still broken, do anyone have a workaround ?

[Splaktar]

@isyun setting md-item-text="item.name" like in the demo fixes this. I updated the CodePen and this seems to work fine.

@mihaellenic I updated the CodePen but the use case here is unclear to me. Why would I ever want to have a value without a name? It would not be displayed properly as selected and it would never appear in the list of searchable options.

The OP talked about using chips in an autocomplete but neither of the CodePen demos posted here demonstrate that issue.

There is nothing actionable in this report atm. I understand that there has been a suggestion to change a line of code, but I haven't seen a reproduction that demonstrates why this is an important use case.