Angularjs如何设置选择的默认值答案

【问题标题】：Angularjs how to set the default value for selectAngularjs如何设置选择的默认值
【发布时间】：2016-09-13 23:24:03
【问题描述】：

我有以下对象：

defaults = {
0 : {
    id : 10,
    value : "string 1"
    },
1 : {
    id : 22,
    value : "string 2"
    }
}

我想遍历这个对象并将其显示为一个选择框。

<select ng-model="selectedValue" ng-options="obj.id as obj.value for obj in defaults">
   <option value="">---Select option-----</option>
</select>

我想要实现的是默认选择“字符串 2”。但它不起作用。我遇到的问题是 selectedValue 是一个字符串：

$scope.selectedValue = "string 2";

从我从文档中了解到的 selectedValue 必须是同一个对象。但不幸的是，这是不可能的。在我的情况下 selectedValue 必须是一个字符串。换句话说我只需要使用选项的名称来操作，我不关心id。我尝试使用 ng-repeat。它甚至可以工作，但显示一个空选项，我认为使用 ng-repeat 不是一个好方法。

任何建议将不胜感激。

【问题讨论】：

如果你希望 selectedValue 包含值，而不是 ID，那么你不应该使用 obj.id as obj.value，而应该使用 obj.value as obj.value
非常感谢。正是我需要的。请重新发布您的评论作为回复。我会接受的。
您想要所选选项的整个对象还是只想要字符串值？

标签： angularjs angularjs-ng-repeat ng-options angularjs-ng-options

【解决方案1】：

如果您希望 selectedValue 变量包含值而不是 ID，则不应使用 obj.id as obj.value，而应使用 obj.value as obj.value。

【讨论】：

【解决方案2】：

选择的值应该是id；

 $scope.selectedValue = 22;

见Demo

编辑：

更改模板

 <select ng-model="selectedValue" >
   <option value="">---Select option-----</option>
   <option ng-selected="selectedValue == obj.value" value="{{obj.value}}" ng-repeat="obj in defaults">{{obj.value}}</option>
 </select>

见更新Demo

【讨论】：

请在上面看到我。 selectedValue 始终是一个字符串。这就是 api 的工作方式，我没有能力改变它。它只返回所选选项的名称，例如“字符串 2”和选项列表。
默认是对象还是数组？
默认是一个对象。
是默认渲染选择框吗？
是的，完全正确。我承认这可能很奇怪，并且可能稍后会更改 api（我对此没有响应），但现在它应该以这种方式工作。

【解决方案3】：

我认为您误解了文档。

选择的值应该是同一个对象的值，而不是对象本身。

因此，您可以将默认值设置为：

$scope.selectedValue = $scope.defaults[1].value;

这样，将设置默认值 - 值是字符串还是数字都没有关系。

【讨论】：

请看我对上面回复的cmets。我无法设置 selectedValue。 selectedValue 是 always API 返回的字符串。 defaults 是 ip 返回的对象。因此，必须通过值进行比较，而不是通过 id。
@user3174320 默认值不能这样工作。您需要做的是，一旦 API 返回字符串，循环遍历 default 对象的属性，当值匹配时，将该属性值分配给 selectedValue。不要将API返回的值直接附加到selectedValue

【解决方案4】：

如果你使用带有选项的 ng-repeat，你需要在你的选项标签上使用 on-last-repeat。例如 select name="repeatSelect" id="repeatSelect" ng-model="usertypes.SelectedId"

option ng-repeat="option in usertypes.AvailableOptions" value="{{option.Id}}" ng-selected="option.Id === usertypes.SelectedId" on-last-repeat>{{option .名称}}

选择

【讨论】：