npm package: @interaction/form-validator
Description: ## 安装
Latest version: 0.2.0

# 快速上手(FormValidator)

## 安装

```
npm i @interaction/form-validator
```

## 导入

```
import { FormValidator } from '@interaction/form-validator';
```

## 使用

表单实例化时，直接将验证加入。如下ts代码

```js
export class Component {
  public form: FormGroup;
  constructor(
    private fb: FormBuilder
  ) {
    this.form = this.fb.group({
      input: [null, [FormValidator.phoneValidator()]]  // 这里使用
    });
  }
}
```

通过nz-form-explain标签捕获错误。如下html代码

```html
<form nz-form [formGroup]="form" >
	<nz-form-item>
       <nz-form-label nzRequired>输入框</nz-form-label>
        <nz-form-control>
            <input 
               nz-input
               formControlName="input" />
            <nz-form-explain *ngIf="form?.get('input')?.dirty && form?.get('input')?.errors">
                <nz-form-explain *ngIf="form?.get('input')?.hasError('phone')">  // 这里是使用代码
                    只支持数字、字母或下划线
                </nz-form-explain>
            </nz-form-explain>
        </nz-form-control>
    </nz-form-item>
</form>
```




## 介绍

| 验证函数                | 含义                                  | 是否有参数 | 参数默认值                                                   | html错误字段               |
| ----------------------- | ------------------------------------- | ---------- | ------------------------------------------------------------ | -------------------------- |
| trimSidesValidator      | 强制必填项（两侧不能有空格）          | 无         |                                                              | hasError('trimSides')      |
| phoneValidator          | 手机号验证                            | 有         | /^1[3-9]{2}[0-9]{8}$/                                        | hasError('phone')          |
| cardIDValidator         | 身份证号验证                          | 有         | /^[1-9]\d{5}[1-9]\d{3}((0[1-9])\|(1[0-2]))((0[1-9])\|(\[1-2][0-9])\|(3[0-1]))\d{3}(\d\|x\|X)$/ | hasError('cardID')         |
| emailValidator          | 电子邮箱验证<br/>（多邮箱用分号分隔） | 有         | /^((([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6}\;))*(([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})))$/ | hasError('email')          |
| numValidator            | 纯数字验证（包括小数）                | 有         | /^[0-9]+(.[0-9]+)?$/                                         | hasError('num')            |
| enValidator             | 纯英文验证                            | 有         | /^[a-zA-z]+$/i                                               | hasError('en')             |
| enNumUnderlineValidator | 只支持英文、数字和下划线              | 有         | /^\w+$/i                                                     | hasError('enNumUnderline') |
| charMaxLength           | 中英文字符最大长度                    | 有         | 255(最大长度默认为255)                                       | hasError('charMaxLength')  |
| checkboxChecked         | 验证checkbox选中                      | 有         | 1（至少一个被选中）                                          | hasError('noMatch')        |
| checkboxCheckedAll      | 验证checkbox必须全部选中              | 无         |                                                              | hasError('noMatch')        |
| notEmptyArray           | 数组不为空验证                        | 有         | 1（至少一个不为空）                                          | hasError('empty')          |
| notEmptyArrayAll        | 数组中必须全部有值                    | 无         |                                                              | hasError('empty')          |
| IPValidator             | IP地址验证                            | 有         | /^(([0-9]{0,3})\.){3}([0-9]{0,3})$                           | hasError('ip')             |
| pathValidator           | 文件路径验证                          | 有         | /^\/.*$/i                                                    | hasError('path')           |
| urlValidator            | url验证                               | 有         | /^((http\|ftp\|https):\/\/)?([\w-]+\.)+[\w-]+([\w-./?%&=]*)?$/ig | hasError('url')            |