如何用Angular的ControlValueAccessor实现自定义表单控件来处理长尾词输入？

本文共计819个文字，预计阅读时间需要4分钟。

在Angular自定义表格控件时，有时您可能需要输入的不是标准的文本输入、选择框或复选框。通过实现ControlValueAccessor接口并将组件注册为NG_VALUE_ACCESSOR，您可以无缝地将自定义表单控件集成到Angular中。

在 Angular 自定义表单控件，有时你想要的输入不是标准的文本输入、选择或复选框。通过实现ControlValueAccessor 接口并将组件注册为 NG_VALUE_ACCESSOR，您可以将自定义表单控件无缝地集成到模板驱动或响应表单中，就像它是本地表单一样!

ControlValueAccessor

ControlValueAccessor 是一个接口，充当Angular API 和 DOM 元素之间的桥梁

ControlValueAccessor 是一个连接表单模型和视图（DOM元素）的接口，自定义的表单控件必须实现这个接口，它的作用是：

• 把 form 模型中值映射到视图中
• 当视图发生变化时，通知 form directives 或 form controls

Angular 引入这个接口的原因是，不同的输入控件数据更新方式是不一样的。例如，对于我们常用的文本输入框来说，我们是设置它的 value 值，而对于复选框 (checkbox) 我们是设置它的 checked 属性。