在 ngSelect 中设置默认值

Question

我有一个 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.

请帮助？

Answer 1

尝试这种方式

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

.

Answer 2

怎么样使用 ngSelected? http://docs.angularjs.org/api/ng/directive/ngSelected

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

或者

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

Answer 3

工作示例： 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的列表。

Answer 4

我没有足够的声誉来发表评论，所以我将其作为答案。

Ramesh Rajendran 的答案是正确的，但您尝试使用不同的 ngOptions 句法。如果您使用 label for value in array 语法，那么您必须将模型属性绑定到整个对象。如果您在评论中使用语法，即 select as label for value in array 那么你必须将模型绑定到选择。

换句话说，他的示例有效，而您的注释示例则需要替换 $scope.selectedlanguage = $scope.languages[0]; 和 $scope.selectedlanguage = $scope.languages[0].i18n;

检查 选择指令文档 了解更多信息

Answer 5

这适用于我：

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

.

live示例： plunker