angular – 使用表单构建器的自定义表单控件属性

发布时间：2020-12-17 18:06:47 所属栏目：安全来源：网络整理

导读：有没有办法使用Angular中的表单生成器添加名为filterMode的自定义属性？我正在创建一个搜索表单,但希望能够将过滤器类型绑定到它,如startsWith,contains,equal等.当我获得FormGroup控件对象时,我希望能够访问每个表单控件的这个值. 例如： public queryForm:

有没有办法使用Angular中的表单生成器添加名为filterMode的自定义属性？我正在创建一个搜索表单,但希望能够将过滤器类型绑定到它,如startsWith,contains,equal等.当我获得FormGroup控件对象时,我希望能够访问每个表单控件的这个值.

例如：

public queryForm: FormGroup;


constructor(
    private fb: FormBuilder,) {
    this.queryForm = this.fb.group({
      username: [value: '',filterMode:'contains'],email: [value: '',});
  }

有没有办法在Angular中扩展FormGroup？

解决方法

您需要使用值访问器创建组件.

编号：https://angular.io/api/forms/ControlValueAccessor

我们的想法是构建组件,实现值访问器和接口方法然后你可以使用该组件作为复杂的formgroup元素..像这样的东西：

constructor(
    private fb: FormBuilder,) {
    this.queryForm = this.fb.group({
      username: [value: ''],});
  }

你的用户名实际上是：

export class SomeType {
   username:string,filterMode:string
}

因此,基本上,您的表单的用户名字段变为复杂类型SomeType.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!