Pregunta

Tengo un ngSelect con algunas opciones.

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

y un 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" }
    ];
}])

Quiero que ngSelect tenga una opción predeterminada, en mi caso:"Inglés".Intenté configurarlo en:

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

¿Ayuda por favor?

¿Fue útil?

Solución

Pruebe de esta manera

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

// JS Code

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];**
}])

Otros consejos

¿Qué tal si se usa ngSelected? http://docs.angularjs.org/api/ng/directive/ngselected

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

o

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

Ejemplo de trabajo: 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:

  • haber eliminado el $translate servicio para facilitar la reproducción.
  • han cambiado un ng-changed devolución de llamada a un $watch sobre el $scope pero esa es una elección meramente estética.
  • El cambio crucial fue que estabas eligiendo el lang.i18n para type pero nos estábamos poniendo type a lang.language, por lo que no hubo coincidencias en el options lista.

No tengo suficiente reputación para comentar así que lo dejaré como respuesta.

La respuesta de Ramesh Rajendran es correcta, pero intentaste usar una diferente ngOptions sintaxis.Si usas el label for value in array sintaxis, entonces debe vincular el atributo del modelo a todo el objeto.Si usa la sintaxis en su comentario, que es select as label for value in array entonces tienes que vincular el modelo a la selección.

En otras palabras, su ejemplo funciona, y para que su ejemplo en el comentario funcione debe reemplazarlo $scope.selectedlanguage = $scope.languages[0]; con $scope.selectedlanguage = $scope.languages[0].i18n;

Comprobar el seleccionar documentación directiva para mayor información

Esto funcionó para mí:

$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>

Ejemplo en vivo: plunker

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top