Question

值<{1}}的

ngControl即使文件有效也无效。

（实际上，我发现很难验证单选按钮......）

Answer 1

Validators.required取决于该字段的值。

输入类型file没有值，因此被视为undefined或null。

这就是无效的原因。最好写下你自己的验证。

对于自定义文件validation example refer

Answer 2

与普通require属性一起使用的验证器示例可能是这样的

import { Provider, forwardRef, Directive } from '@angular/core';
import { NG_VALIDATORS, Validator, Control } from '@angular/common';
export const NO_ATTACHMENT_VALIDATOR = new Provider(NG_VALIDATORS,{
  useExisting: forwardRef(() => noAttachmentValidator ),
  multi: true
});

@Directive({
  selector: '[noAttachmentValidator][ngControl],[noAttachmentValidator][ngFormControl],[noAttachmentValidator][ngModel]',
  providers: [NO_ATTACHMENT_VALIDATOR]
})

export class noAttachmentValidator implements Validator{
  public validate(control: Control) : { required: { [key: string]: boolean } | null } {
    let state,
        value = control.value,
        alreadyUsed = control.dirty;

    if(alreadyUsed && value.length == 0){
      state = true;
    }
    return state ? { required : { 'required' : false } } : null
  }
}

基本上需要的属性是第一次检查，这是每次你在第一次使用输入后，即使你删除文件（这是我的问题）导致值的控制为null。如果它没有被触及它是空的，那么当你添加一个文件时它会被填满，但是如果你删除它它只是一个空数组所以 []！== null。我希望这有助于遵循这一点，如果需要，您可以构建自己的验证类型。

Answer 3

解决此问题的一个很好的解决方案是创建一个自定义元素，用于包装和实现ValueAccessor。这样，您就可以创建一个与其他表单元素完全相同的自定义组件。您可以在组件内使用另一个变量，而不是使用输入值。

此处提供更多信息：Applying angular2 form directives to custom input form elements

如何使用Angular2验证<input type =“file”/>？

3 个答案: