Angular 中的未知管道

Question

在 indice 页面中，我想将 cours 列中的数字格式化为两位小数。

示例：11345.654589 至 11345.65。

我在 shared/pipes 中创建了一个 format-num.pipe 文件夹。

pipes.module.ts

import { NgModule } from '@angular/core';
import { CommonModule, DecimalPipe } from '@angular/common';
import { FormatNumPipe } from './format-num.pipe';

@NgModule({
  declarations: [
    FormatNumPipe
  ],
  imports: [
    CommonModule
  ],

  providers: [
    DecimalPipe,
  ]

})
export class PipesModule { }

格式-num.pipe.ts

import { DecimalPipe } from '@angular/common';
import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'formatNum'
})
export class FormatNumPipe implements PipeTransform {


  constructor(private decimalPipe: DecimalPipe) {
  }

  transform(input: number | string | null | undefined, digitsInfo?: string): string | null {
    return this.decimalPipe.transform(input, digitsInfo);
  }

}

indice.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { IndiceComponent } from './indice.component';
import { PipesModule } from 'src/app/shared/pipes/pipes.module';


@NgModule({
  declarations: [
    IndiceComponent
  ],
  imports: [
    CommonModule,
    PipesModule,
  ]
})
export class IndiceModule { }

indice.component.html

<td class="text-end"> {{ indiceData.valeur | formatNum:'1.2-2' }} </td>

错误信息是：

src/app/views/dashboard/views/market/views/indice/indice.component.html:18:66 - error NG8004: No pipe found with name 'formatNum'.

18  <td class="text-end"> {{ indiceData.valeur | formatNum:'1.2-2' }} </td>

我的代码在 Stackblitz 上可用。

在这个页面上here...他们说这是模块声明的问题？但是我声明了。

Answer 1

我猜你错过了导出你的管道。

在pipes.module.ts:

exports: [
    FormatNumPipe
  ],

注意：您在 format-num.pipe 文件的末尾有一个错误（一个额外的 '}'）。

Angular 中的未知管道

Unknown Pipe in Angular

angular-pipe

angular