Как установить начальное значение для combobox в угловом?

Question

Если я хочу, чтобы установить значение выпадающего списка я попытался это:

controllercode:

$scope.streettypeMockData = [{ 
    name: 'Street', 
    value: 'Street' 
    }, { 
    name: 'Avenue' 
    }, { 
    name: 'Crescent' 
    }, { 
    name: 'Drive' 
    }, { 
    name: 'Road' 
    }, { 
    name: 'Highway' 
    }]; 

    var sel = "Street"; 
    var selectedValue = { 
    name: sel 
    }; 
    $scope.streetTypeSelected = selectedValue; 

Может кто-нибудь сказать мне, почему это не работает? Смотри также http://plnkr.co/edit/4ISL8A1cNGCtafsc0leX?p=preview

Answer 1

Код имеет несколько проблем:

• ng-options выбрать имя, в то время как ng-model указывает на объект. Лучше использовать streetType as streetType.name for streetType in streettypeMockData для выбора всего объекта.
• В этом случае начальное значение не будет выполнено, потому что Angular попытается сравнить объекты по ссылке; использование track by.

The полный <select> должно быть:

<select class="form-control" ng-model="streetTypeSelected" 
     ng-options="streetType as streetType.name for streetType in streettypeMockData track by streetType.name"> 

См forked plunker.

Answer 2

Вы можете просто использовать ng-init как этот

<select ng-init="streetTypeSelected = streettypeMockData[0]" class="form-control" ng-model="streetTypeSelected" ng-options="streetType.name for streetType in streettypeMockData"> 
    </select> 

Working Demo

Также вы можете сделать, как, как показано ниже

var app = angular.module('myApp', []); 
app.controller('MainCtrl', function ($scope) { 
    $scope.streettypeMockData = [ 
     {name: 'Street', value: 'Street'}, 
     {name: 'Avenue'}, 
     {name: 'Crescent'}, 
     {name: 'Drive'}, 
     {name: 'Road'}, 
     {name: 'Highway'} 
    ]; 
    $scope.streetTypeSelected = $scope.streettypeMockData[0]; 
}); 

Working Demo

Также посмотрите на эту

https://docs.angularjs.org/api/ng/directive/select