Question

所以我有以下代码：

<select id="basicInput" ng-model="MyCtrl.value">
    <option value=""></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

但是在控制台中，我发现了这个：

<select id="basicInput" ng-model="MyCtrl.value">
    <option value="? object:null ?"></option>
    <option value=""></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

我之前看到过这个问题已经解决，但我发现的所有答案都与ng-options或ng-repeat搏斗。这段代码既不使用，所以为什么我首先得到这个问题？更重要的是，如何阻止我的页面使用幻像选项加载此标记？它与ng模型有关吗？

编辑：

自从提出这个问题以来，我已将以下内容添加到我的代码中：

<select id="basicInput" ng-model="MyCtrl.value">
    <option value="0"></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

我还设置了Myctrl.value = 0.我仍然发现自己有同样的错误。想法？

Answer 1

此问题之前已经回答过。请检查URL。根据他们

ng-model引用的值时会生成空选项并不存在于传递给ng-options的一组选项中。有时候是这样的防止意外模型选择：AngularJS可以看到初始模型未定义或未在选项集中不想自己决定模特价值。

相反，你可以这样做

<select id="basicInput" ng-model="MyCtrl.value">
  <option value="" ng-if="false"></option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>

简而言之：空选项意味着没有选择有效模型（有效我的意思是：来自选项集）。您需要选择一个有效的模型值来摆脱这个空选项

Answer 2

您必须将MyCtrl.value初始化为选项提供的值之一，否则Angular将呈现空选择，因为所选模型在选项列表中不存在。

在MyCtrl中

：

$scope.value = 1;

摆脱选择标记中的空白项目

2 个答案: