网站搜索

javascript - Angular 2 中下拉字段的验证


我正在使用 [email  版本。我如何对选择的 字段 进行 验证?

<div class="form-group" [class.has-error] = "schoolError">
            <label class="control-label" for="lang">Select School</label>
            <select class="form-control" name="school"  
            required #school
            [(ngModel)] = "model.school">
                <option value="default">Select a school</option>
                <option *ngFor= "let sch of school">{{sch}}</option>
            </select>
        </div>   

 <button class="btn btn-primary" 
     [disabled] = "form.invalid" type="submit">Submit</button>

基本上,我想在 选择字段 无效时禁用按钮? 当没有选择值时,如何让选择字段 无效?

答案#1

你可以创建一个布尔变量,并将其默认值分配为 false。当用户选择任何选项时,它将变为 true。

https://plnkr.co/edit/yR5xz4h3llkxHsUQxFJB?p=preview

<div>
  <select [(ngModel)]='selected'>
    <option value='one'>Three</option>
    <option value='two'>Two</option>
  </select>
  <button [disabled]='!selected && form.status == 'VALID'>click</button>
</div>
selected:boolean = false;

答案#2

尝试将默认选项中的值更改为空字符串:

<option [value]="">Select a school</option>