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文件中的表

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

每当用户输入当天的金额时，值显示如下：

4.3,5.2,2.3

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

最近我遇到了管道并安装了角管。将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都回应了。