Question

我在控制器中定义了这个tempScale对象：

$scope.tempScale = {
    scaleType : [],
    deviations : [],
    intervals : 0
};

哪个连接到我的html：

<select id="scales" ng-model="tempScale.scaleType" class="form-control">
    <option value="Manually Calculated" ng-selected="true">Manually Calculated</option>
    <option value="Automatically Calculated">Automatically Calculated</option>
</select>

我添加了ng-selected=true，因此手动计算将是第一个和选中的选项（基本上是默认选项1），但是，当我运行页面时，我的HTML看起来像：

<select id="scales" ng-model="tempScale.scaleType" class="form-control ng-valid ng-dirty ng-touched">
    <option value="? undefined:undefined ?"></option>
    <option value="Manually Calculated" ng-selected="true" selected="selected">Manually Calculated</option>
    <option value="Automatically Calculated">Automatically Calculated</option>
</select>

为什么这些ng类出现在加载中，这个未定义的选项值来自何处？这不是一个循环，所以我很困惑。

Answer 1

您不需要ng-selected。将模型从控制器设置为$scope.tempScale.scaleType='Manually Calculated';。

使用带有select元素的ng-model指令时，无法设置默认选择的项目。 select元素绑定到模型字段，该数据未定义。选择应显示什么值？是的，未定义。您尝试通过标记传递数据，它不是Angular方式。只需将数据保存在JS模型中，而不是HTML标记中。[Ref]

Plunker demo

角度选择添加未定义的选项

1 个答案: