Question

我有一个默认的选择值，没有完成所需的验证：

<form name="testForm" novalidate>
  <select ng-model="model.selecter" required ng-options="opt for opt in options">
    <option value="">Select One</option>
  </select>
</form>

$scope.options = [
    'First',
    'Second',
    'Third'
];

而＃34;选择一个＆＃34;已被选中，testForm.$valid为false，应该如此。

但是，我希望能够将我的占位符添加到options数组中，但在此实例中，它将其标记为有效。

<form name="testForm" novalidate>
  <select ng-model="model.selecter" required ng-options="opt for opt in options">
  </select>
</form>

$scope.options = [
    'Select One',
    'First',
    'Second',
    'Third'
];

$scope.model = { selecter: $scope.options[0] }; // sets the default selected option

此处testForm.$valid始终为true。有没有办法让我的Select One选项不符合表单的required状态？

Answer 1

不确定为什么要尝试使有效的东西复杂化，但如果必须的话，你也必须做一些其他的改变。将您的选择更改为此

             <select ng-model="model2.selecter" required ng-options="opt.value as opt.label for opt in options2">
             </select>

你的价值观就像这样

      $scope.options2 = [
        {label:'Select One',value:''},
        {label:'First',value:'1'}
      ];

并且不要为模型变量赋值。把它留空。

         $scope.model2 = { 
            selecter: ''
        };

Angular required select选项不适用于占位符

1 个答案: