Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

<select> with <option> does not set default option correctly #14916

Closed
c1moore opened this issue Jul 15, 2016 · 1 comment
Closed

<select> with <option> does not set default option correctly #14916

c1moore opened this issue Jul 15, 2016 · 1 comment

Comments

@c1moore
Copy link

c1moore commented Jul 15, 2016

The Problem
The expected behavior of <select> when using ngModel is to create a default blank <option> when none of the ngRepeated options match the model, as noted in this issue. However, this seems to occur even when the model matches a valid option.

The Proof
Here is a demo of the bug. It seems the second select option defaults to the only option available, hence the bug does not appear. However, the other 3 examples demonstrate the bug. The first select demonstrates the bug in its simplest form. The third select option uses {{}} in the ngSelected directive to demonstrate that the expression does evaluate to true. The final select shows that the issue remains even when a timeout is used to switch the selected option programmatically.

What is Expected?
If ngSelected evaluates to true, as it does in the sample code, the default empty <option> should not be created. Instead, the dropdown should default to the option that matches the model.

Why?
If the model is set appropriately, obviously there is a default value that should be selected. Maybe the user is visiting this page to update data and the dropdown should be set to the value previously selected. For my use case, the dropdown is tied to the current page number and blank is not a valid page number.

Version/Environment
I am using version 1.4.9. I have tested this and seen the bug in both Firefox and Chrome.

@Narretz
Copy link
Contributor

Narretz commented Jul 15, 2016

There are two things going on:

  1. ngSelected does not have any special interop with ngModel. It simply sets the selected attribute on the option, nothing else. When you have ngModel, it will try to match the model value with one of the options completely independently from any selected attribute that has been set by ngSelected

  2. In your examples, ngModel doesn't match the option value because you are setting the model to a number. However, the option value is a string, so the strict comparison fails. This is why there is ngOptions - so that you can use any value type. In 1.6, you will also be able to do this without ngOptions by using ngValue.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

2 participants