使用Angular JS在select标记的选项中附加空值

Question

在将选项值附加到选择标记时，还会使用Angular JS附加空选项标记。我无法弄清楚为什么会这么说。 这是我的JS代码

    // Create global countries array.
    $scope.countries = [];

    countryPromise.success(function(data, status, headers, config) {
        for(index in data) {
                console.log("ID:"+data[index].id+" Name:"+data[index].name);
            $scope.countries.push({
                id:data[index].id,
                name:data[index].name                   
            });
        }
        $scope.countrylist = $scope.countries;

我的HTML

<select ng-model="country" ng-change="changeCountry()" ng-options="v.name for v in countrylist">

控制台输出

ID:1 Name:India 

Answer 1

如果您的型号（国家/地区）未设置为某个国家/地区，那么您最初将看不到所选的值，当您首次打开下拉列表时会显示为空行，但选择的项目应该会消失。这当然是基于您的数组没有空值的假设。

添加了一个示例小提琴：

http://jsfiddle.net/65RkM/1/

<select ng-model="country" ng-options="c.name for c in countrylist"></select>

Answer 2

很可能是从数据库返回空白记录。最简单的解决方案是检查空白索引。

// Create global countries array.
$scope.countries = [];

countryPromise.success(function(data, status, headers, config) {
    for(index in data) {
        if (data[index].id) {
            $scope.countries.push({
                id:data[index].id,
                name:data[index].name                   
            });
        }
    }
    $scope.countrylist = $scope.countries;