FormControl 属性的 SplitPipe 不起作用

Question

我正在尝试根据输入值之间的逗号拆分提交给表单的输入值。这是一个例子，

TS 文件

export class FoodComponent implements OnInit {
  myForm: FormGroup;
  private food;

  amount = new FormControl('', Validators.required);

  constructor(public serviceFood: FoodService, fb: FormatBuilder) {
    this.myForm = fb.group({
      amount: this.amount
    });
  };

  ngOnInit():void {
    this.loadAll();
  }
}

对于 HTML 文件中的 table

<td>{{food.amount}}</td>

每次用户输入他们当天拥有的数量时，值显示如下：

4.3,5.2,2.3

所有输入都在一个单元格中呈现。我想拆分它们并在一个单元格中的不同行中打印它们，或者在多行中的多个单元格中打印它们。

最近我遇到了管道并安装了 angular-管道。将 SplitePipe 导入到我的本地 ts 文件中。但是当我进行以下更改时，什么也没有出现：

<td>{{food.amount | split(',')}}</td>

也试过用Hello World拆分，我的页面上不来：

<td>{{'Hello World' | split}}</td>

我正在搜索所有的解决方案。任何帮助将不胜感激。

Answer 1

将参数传递到管道的语法与常规函数略有不同。您不使用括号和逗号，而是在每个参数前使用 :，如下所示：

<td>{{ food.amount | split : ',' }}</td>

Answer 2

我在 app.module 中缺少导入。对于普通管道，我需要在 app.module 中 import {CommonModule} from '@angular/common'; 并在导入中声明。另外，在本地组件中导入它们。

对于拆分，我需要在 NgModule 中声明。 @Ashok 和@Mendy 也都回复了。

FormControl 属性的 SplitPipe 不起作用

SplitPipe for a FormControl property does not work

angular

angular4-forms

angular-pipe

FormControl 属性 的 SplitPipe 不起作用

SplitPipe for a FormControl property does not work

angular

angular4-forms

angular-pipe

FormControl 属性的 SplitPipe 不起作用