Hard coded <option> causes error "TypeError: Cannot read property 'getOptionFromViewValue' of undefined"

[godza]

Hi, in documentation is stated that 'empty option' can be used when using ng-options. Here is direct quote

Optionally a single hard-coded option element, with the value set to an empty string, can be nested into the select element. This element will then represent the null or "not selected" option

I used that in 1.3 very heavily and it worked flawlessly, but in 1.4 i'm getting error

TypeError: Cannot read property 'getOptionFromViewValue' of undefined

Just to be clear, here is the template i'm using

<select ng-options="option.id as option.name for option in selectable_options">
  <option value="">Choose an option</option>
</select>

Is this planed regression or a bug? If this is planed regression, is there a workaround for the thing i'm trying to accomplish?

[gkalpak]

I can't reproduce the error. Which version are you using. Ideally you should provide and live reproduction using CodePen, JSFiddle, Plnkr or a similar.

_{You should also use ngModel on the select.}

[godza]

Hi, i was using 1.4 rc and i built latest angular from git master, but it's the same error. Here is the plunkr but error thrown there is not the one you get when you're running from files on your computer

As you can see, the select is not populated with options.

http://plnkr.co/edit/l0SV6rcOeVufxJ2f6oNm?p=preview

[gkalpak]

I don't get any error. (Neither on my computer nor in the plnkr.)
ngOptions requires ngModel, so it won't populate your <select>, unless you have ngModel on it.

Updated plnkr

[lammel]

We are seeing the same issue in our application. But only in a particular situation (we pass the a model to a directive which in turn displays the select with the hardcoded empty option). Other usage of select with ng-options works fine (also with the hardcoded empty option).

We try to isolate the issue in a plunker for further analysis.

[godza]

@gkalpak i finally managed to reporoduce the problem, even on plunker.

The catch is that template of customSelect directive in my example needs to be loaded via templateUrl. In that case i see errors and list is not printed.

http://plnkr.co/edit/l0SV6rcOeVufxJ2f6oNm?p=preview

• If you edit select_template.html file and remove empty option it works
• if you copy/paste select_template.html content and paste it in template property of directive definition, it will work even with empty option

[bbasic]

Just to be thorough.
It will work in a situation where replace: true is not used.

plunker
Uncomment the line 27 in app.js to see the error.

[gkalpak]

Indeed it seems that the combination of templateUrl (instead of template) and replace: true results in no options being created.
I am not sure if this should be fixed though, considering that replace: true has been deprecated.

@petebacondarwin, wdyt ?

[godza]

@gkalpak even though it's deprecated it should be working properly until removed.