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.
Select elements bound to a scope property with a value of null will add an extra option #11872
Closed
Description
On upgrading from angular 1.2.23 to 1.3.15 I noticed a bug when select elements are bound using ng-model to a scope property which is predefined as null. These elements render an additional option elements which looks like <option value="? object:null ?"></option>, the result of this as an extra blank option on the dropdown.
The following code sample demonstrates the problem by comparing a select bound to a null property with a select bound to an undefined property.
<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
<script>
var module = angular.module('app', []);
module.controller('AppCtrl', ['$scope', function($scope){
$scope.defined = null;
}]);
</script>
</head>
<body ng-controller="AppCtrl">
<p>Defined Variable:</p>
<p ng-bind="defined"></p>
<form>
<select ng-model="defined" name="select-defined" id="select-defined">
<option value=""> -- Please Select one --</option>
<option value="a"> A </option>
<option value="b"> B </option>
<option value="c"> C </option>
</select>
</form>
<p>Undefined Variable:</p>
<p ng-bind="foo"></p>
<form>
<select ng-model="foo" name="select-undefined" id="select-undefined">
<option value=""> -- Please Select one --</option>
<option value="a"> A</option>
<option value="b"> B</option>
<option value="c"> C</option>
</select>
</form>
</body>
</html>I've tested this with 1.4.0-rc.2 and the problem still exists.
I believe the fix should be to treat null properties the same as undefined.