angularjs ng-option 空白选项改为预选

Question

我在将预选值显示为我的选择元素中的选定选项时遇到问题。代码来了

<select ng-model="data.company" ng-options="company as company.name for company in companies"></select>


$scope.companies =[{
    id:1,
    name:"Company 1"
},
{
    id:2,
    name:"Company 2"
}];

$scope.data = {
    company:{
        id:2,
        name:"Company 2"
    }
}

问题是，当我进入该部分时，选择会给我一个空白选项，默认情况下会显示“公司 2”。我做错了什么？

Answer 1

在这种情况下，您需要使用track by，因为您将对象值直接分配给ng-model。在这种情况下，当您将对象直接绑定到data.company(ng-model) 跟踪时，通过表达式检查ng-model 中的company.id 以及每个companies 元素id。如果任何一个匹配，它会预先选择该输入。

标记

<select ng-model="data.company" 
   ng-options="company as company.name for company in companies track by company.id">
</select>

Demo Plunkr

Answer 2

你可以尝试使用 ng-init

<select ng-init="data.company= companies[0]" 
        ng-model="data.company" 
        ng-options="company as company.name for company in companies"></select>

Answer 3

试试这个

 <select ng-model="data.company" ng-options="company.name for company in companies"></select>

  $scope.data = {
      company: $scope.companies[1];
  };

您希望下拉列表中显示的值是公司名称，而存储的对象是公司。