在p-chips和formcontrolname中间设置一个逻辑

Question

需要 p-chips 和反应形式的帮助：我在 formgroup 中有一个结构，它像数据库项一样构建。

valueSeperatedBySemi = "hi; hello; Whoop"

我需要这样设置：

<p-chips formcontrolname="myFormCName" separator=";">

但是它不起作用，因为 p-chips 需要一个数组。我无法将 valueSeperatedBySemi 更改为数组。

我该如何解决这个问题？

Answer 1

separator 属性用于替换默认回车键以将项目添加到芯片组件。所以它对你的情况没有用。

我认为您应该在组件和数据之间设置一个中间变量。我们称它为 values：一个字符串数组。

<p-chips [(ngModel)]="values"></p-chips>

首先，您需要将输入数据转换为字符串数组以填充筹码组件：

this.valueSeperatedBySemi = "hi; hello; Whoop";
this.values = this.valueSeperatedBySemi.split("; ");

然后，如果您想取回数据库中格式相同的数据，则必须以这种方式将其转换回来：

this.valueSeperatedBySemi = this.values.join("; ");

当然，您可以使用 formControl 轻松调整它。

Set a logic in the middle between p-chips and formcontrolname