Angular 2:文件扩展名和大小的自定义验证

时间:2017-03-14 17:39:17

标签: angular

我的表单中有一个<input type='file>元素。我想创建一个自定义验证来检查文件大小和扩展名。我使用反应FormBuilderFileReader API来获取输入元素字段数据的文件名和大小。

问题:我们可以在更改事件上触发自定义验证,但无法获取输入类型字段的值。

请建议我们如何在angularjs 2中实现文件扩展名和大小的自定义验证。

这是我的代码:

HTML:

<input type="file" (change)="changeThumbFile($event)">

组件:

//custom validation
function validateExt(c: FormControl) {
    let extension = ['png', 'jpeg', 'gif'];
    return extension.indexOf(c.value)? null : { validateExt: { valid: false } }
}
this.form = this.formBuilder.group({
  'thumbnailImg': ['', validateExt],
});
changeThumbFile($event){
    var file: File = $event.target.files[0];
    var fReader: FileReader = new FileReader();

    var imgName = file.name;
    this.thumbnailName = imgName;

    this.formGp.controls['thumbnailImg'].updateValueAndValidity();
}

0 个答案:

没有答案