error-collect 表单异常消息采集器

一个简单的表单异常消息采集器,点击图标跳转相应的位置;必须是一个标准 form 表单。

  1. import { ErrorCollectModule } from '@delon/abc/error-collect';

代码演示

error-collect 表单异常消息采集器 - 图1

基础

一般配合 footer-toolbar 一起使用。

  1. import { Component, OnInit } from '@angular/core';
  2. import { FormBuilder, FormGroup, Validators } from '@angular/forms';
  3. @Component({
  4. selector: 'components-error-collect-basic',
  5. template: `
  6. <form nz-form [formGroup]="validateForm">
  7. <nz-form-item>
  8. <nz-form-control>
  9. <input nz-input formControlName="email" id="email">
  10. </nz-form-control>
  11. </nz-form-item>
  12. <error-collect></error-collect>
  13. </form>
  14. `
  15. })
  16. export class ComponentsErrorCollectBasicComponent implements OnInit {
  17. validateForm: FormGroup;
  18. constructor(fb: FormBuilder) {
  19. this.validateForm = fb.group({
  20. email: [ null, [Validators.required] ]
  21. });
  22. }
  23. get email() { return this.validateForm.controls.email; }
  24. ngOnInit(): void {
  25. this.email.markAsDirty();
  26. }
  27. }

API

error-collect

成员说明类型默认值全局配置
[freq]监听频率,单位:毫秒number500
[offsetTop]顶部偏移值,单位:pxnumber145