Defina o valor padrão dentro do ngSelect

Question

Eu tenho um ngSelect com algumas opções.

<select data-ng-model="type" data-ng-change="option(type)">
   <option data-ng-repeat="type in languages" value="{{type.i18n}}">
        {{type.language}}
    </option>
</select>

E um controlador

angular.module('navigation', [])
.controller('NavCtrl',['$scope','$translate', function($scope,$translate){

    $scope.option = function(type){
        console.log(type) //this display the i18n value of languages
        $translate.use(type);
    }

    $scope.languages = [
        { language: "English", i18n: "en_EN"},
        { language: "Swedish", i18n : "se_SE" }
    ];
}])

Quero que o ngSelect tenha uma opção padrão, no meu caso:"Inglês".Eu tentei configurá-lo para:

$scope.type = $scope.languages[0].language; // English
$scope.type = $scope.languages[0]; //The whole darn json object.

Ajuda por favor?

Answer 1

Tente desta forma

<select  ng-model="selectedlanguage" ng-change="option(this.selectedlanguage)"  ng-options="i.language for i in languages">
            </select>

//código Js

angular.module('navigation', [])
.controller('NavCtrl',['$scope','$translate', function($scope,$translate){

    $scope.option = function(type){
        console.log(type) //this display the i18n value of languages
        $translate.use(type);
    }

    $scope.languages = [
        { language: "English", i18n: "en_EN"},
        { language: "Swedish", i18n : "se_SE" }
    ];

    **$scope.selectedlanguage = $scope.languages[0];**
}])

Answer 2

que tal usar ngSelected? http://docs.angularjs.org/api/ng/directive/ngSelected

<option ng-selected="$index==0"></option>

ou

<option ng-selected="type.language=='English'"></option>

Answer 3

Exemplo de trabalho: http://plnkr.co/edit/yv8gew3IDGxjH666UmlC?p=preview

<select data-ng-model="selectedType">
  <option data-ng-repeat="lang in languages" value="{{lang.i18n}}">
    {{lang.language}}
  </option>
</select>

JS:

.controller('NavCtrl',['$scope', function($scope){

    $scope.$watch('selectedType', function(type){
        if (!type) return;
        console.log(type) //this display the i18n value of languages
        // $translate.use(type);
    });

    $scope.languages = [
        { language: "English", i18n: "en_EN"},
        { language: "Swedish", i18n : "se_SE" }
    ];

    $scope.selectedType = $scope.languages[0].i18n;
}]);

Notas:

• Removi o $translate serviço para facilitar a reprodução.
• Mudaram um ng-changed retorno de chamada para um $watch no $scope mas isso é apenas uma escolha estética.
• A mudança crucial foi que você estava escolhendo o lang.i18n para type mas estavam definindo type para lang.language, resultando assim em nenhuma correspondência no optionlista.

Answer 4

Não tenho reputação suficiente para comentar, então deixarei isso como resposta.

A resposta de Ramesh Rajendran está certa, mas você tentou usar um método diferente ngOptions sintaxe.Se você usar o label for value in array sintaxe, então você deve vincular o atributo model ao objeto inteiro.Se você usar a sintaxe em seu comentário, que é select as label for value in array então você tem que vincular o modelo ao select.

Em outras palavras, o exemplo dele funciona, e para o seu exemplo no comentário funcionar, você precisa substituir $scope.selectedlanguage = $scope.languages[0]; com $scope.selectedlanguage = $scope.languages[0].i18n;

Verifica a selecione a documentação da diretiva para mais informações

Answer 5

Isso funcionou para mim:

$scope.prop = { "values": 
[ {name:'hello1',id:1},{name:'hello2',id:2},{name:'hello3',id:3}] };
$scope.selectedValue = 2; 

<select ng-model="selectedValue" ng-options="v.id as v.name for v in prop.values">
    <option selected value="">Select option</option>
</select>

exemplo ao vivo: Plunker