3

我有一个用于生成选择列表的<select>元素，并希望将 selected 设置为. 这是我的html：ng-optionsng-model

<td style="text-align:center">
    <ng-form name="IsTobaccoForm">
        <select name="Input" required ng-model="dep.IsTobacco" ng-options="item.value as item.text for item in yesNoList"></select>{{dep.IsTobacco}}
        <span class="alert-error" ng-show="IsTobaccoForm.Input.$error.required"><strong>*Required</strong></span>
    </ng-form>
</td>

我的控制器包含以下代码：

$scope.yesNoList = [{ value: true, text: 'Y' }, { value: false, text: 'N'}];

如果该项的IsTobacco值为真，则该值设置正确，一切正常。但是，如果它为 false，则会出现所需的错误，即使{{dep.IsTobacco}}呈现为 false。真正奇怪的部分是，如果我将列表中的选定项目更改为 true，它可以正常工作，但是如果我将其设置为 false，则会将一个新的空白项目添加到列表中并选择该空白项目。

如果问题似乎不在上面发布的行中，我可以很乐意发布更多代码。

谢谢！

编辑：我还使用了 chrome 调试器，发现当数据在 Angular 中启动时， 的值IsTobacco等于false.

编辑 2：如果有人看到这个是 AngularJS 的新手，我肯定会推荐阅读这两篇文章：第 1部分和第 2 部分。它们是 AngularJS 表单的概述。

4

1 回答 1

3

发生这种情况的原因是，当与 一起使用时，值false会被解释为缺少。正如这里所讨论的，请考虑 Angular 源代码的摘录：ngModelrequired

var validator = function(value) {
    if (attr.required && (isEmpty(value) || value === false)) {
        ctrl.$setValidity('required', false);

如果有一个必需的属性并且它的值为false，它不会通过验证。这可能是为了更容易验证所需的复选框而故意的，在这种情况下，未选中的默认值为false.

考虑到复选框可以采用ng-true-value和ng-false-value属性，可能不需要这样，但我想要么这样做，要么强制在每个复选框上为这些属性使用非值true和非值，这是更好的选择。false

一种解决方法是改用字符串“true”和“false”。

于 2013-06-18T02:17:05.100 回答