Установить значение по умолчанию внутри ngSelect

У меня есть выбор с некоторыми опциями.

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

И контроллер

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

Я хочу, чтобы у ngSelect была опция по умолчанию, в моем случае: "Английский". Я пытался установить его на:

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

Помогите, пожалуйста?

5 ответов

Решение

Попробуй так

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

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

Как насчет использования ngSelected? http://docs.angularjs.org/api/ng/directive/ngSelected

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

или же

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

Рабочий пример: 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;
}]);

Заметки:

  • Удалили $translate Сервис для удобства воспроизведения.
  • Изменили ng-changed обратный вызов $watch на $scope но это просто эстетический выбор.
  • Принципиальным изменением было то, что вы выбирали lang.i18n за type но были настройки type в lang.languageв результате чего нет совпадений в optionсписок

У меня недостаточно репутации, чтобы комментировать, поэтому я оставлю это как ответ.

Ответ Рамеша Раджендрана правильный, но вы пытались использовать другой ngOptions синтаксис. Если вы используете label for value in array синтаксис, то вы должны привязать атрибут модели ко всему объекту. Если вы используете синтаксис в своем комментарии, который select as label for value in array Затем вы должны привязать модель к выбору.

В словах заказа, его пример работает, и, чтобы ваш пример на комментарий к работе вам нужно заменить $scope.selectedlanguage = $scope.languages[0]; с $scope.selectedlanguage = $scope.languages[0].i18n;

Проверьте дополнительную директивную документацию для получения дополнительной информации.

Это сработало для меня:

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

живой пример: Плункер

Другие вопросы по тегам