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

Regression using ngOptions asynchronously in angular 1.3 #9714

Closed
@FrenchDilettante

Description

@FrenchDilettante

Hi guys,

Just wanted to start by saying that Angular is a wonderful project and I'm having a great time working with it :)

I have an example of the issue in this jsFiddle: http://jsfiddle.net/88aw4yyq/

Consider this HTML:

<select name="test"
        ng-model="test"
        ng-options="opt.id as opt.label for opt in availableOptions">
</select>

And this controller:

$scope.test = '';
$scope.availableOptions = [];

$timeout(function () {
    $scope.availableOptions = [
        {id: '', label: 'Please select...'},
        {id: 1, label: 'opt1'},
        {id: 2, label: 'opt2'}
    ];
}, 1000);

The $timeout simulates any regular AJAX request. {id: '', label: 'Please select...'} is added for convenience for the user.

Expected behavior: 'Please select...' should be selected once the data is loaded.

Actual behavior: An empty option is added on top in the select field.

Angular versions: 1.3.0 this is a regression, 1.2.x was working fine.

Browser versions: Tested on Fx/Chrome (latest versions) on both OS X & Windows.

If anyone else is encountering the issue, here is a workaround:

$scope.test = '';
$scope.availableOptions = [
    {id: '', label: 'Please select...'}
];

$timeout(function () {
    $scope.availableOptions = $scope.availableOptions.concat([
        {id: 1, label: 'opt1'},
        {id: 2, label: 'opt2'}
    ]);
}, 1000);

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions