设置模型值时，Angular将奇怪的选项添加到选择元素中

Question

我有这样定义的选择元素：

<select name="country_id" id="country_id" required="required" ng-model="newAddressForm.country_id">
    <option value="">Select Country</option>
    <option ng-repeat="country in countries" value="{{country.id}}">{{country.name}}</option>
</select>

当我未在包含此选择元素的指令中未设置任何类型的值时，所有方法都可以正常工作。但是，当我执行类似的操作时newAddressForm.country_id = 98，Angular会在select元素的顶部注入一个新值，而不是选择值为98的选项：

<option value="? string:98 ?"></option>

是什么赋予了？这是哪种格式，为什么会发生？请注意，如果我console.log(newAddressForm.country_id)在指令中执行，我会得到一个normal
"98"，它只是在生成的HTML中很奇怪。

编辑： 情况更新。 切换为使用ng-select，但问题仍然存在。

但是，奇怪的元素不再出现，但是，顶部还有另一个元素，该元素只有一个问号?作为值，而没有标签。

根据我的收集，这就是Angular的"none selected"选择。我仍然不明白为什么它不会选择我告诉它选择的选项。

这样做newAddressForm.country_id = 98仍然没有结果。这是为什么？

Answer 1

Angular不会将select元素的值设置为数组的实际值，而是做了一些内部操作来管理作用域绑定。在此链接上查看Mark Rajcok的第一条评论：

https://docs.angularjs.org/api/ng/directive/select#overview

当用户选择选项之一时，Angular使用索引（或键）在数组（或对象）中查找值-
查找值就是模型所设置的值。（因此，未将模型设置为您在HTML中看到的值！这会引起很多混乱。）

我不完全确定使用ng-repeat“最佳”选择。