自定义组件中找不到管道 - 离子3(延迟加载)

时间:2017-06-24 10:56:48

标签: angular pipe components ionic3

在我的离子3项目中,我将管道包裹在pipes.module.ts中并将其导入@NgModule中以用于我所有延迟加载的页面 - 工作正常而没有问题。

但是,在我的自定义组件中使用相同的方法,在组件模板中使用管道会导致错误:

 Error: Template parse errors: The pipe 'min2duration' could not be found

我还尝试在我的组件的.module.ts中单独导入管道,但仍然存在同样的问题。我使其工作的唯一方法是在我的组件.ts文件中导入管道,将其包装在一个函数中,我们这样的函数如下:

import { Min2duration  } from '../../pipes/dates/min2duration';
...

@Component({ ... })
class CustomComponent {
  constructor(){ ... }

  min2duration(val){
    var m2d = new Min2duration();
    return m2d.transform(val)
  }
}

并在模板中

<span>{{ min2duration(duration) }}</span>

这种方式有效,但它并不是一个合适的解决方案,特别是当我在我的项目中使用更多管道和更多自定义组件时。

有没有办法让管道也能在这样的自定义组件模板中运行?

<span> {{ duration | min2duration }}</span>

修改

pipes.module.ts

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

// Pipes
import { DayMonth } from './dates/day-month'
import { Weekday  } from './dates/weekday';
import { Min2duration  } from './dates/min2duration';
import { HighlightPipe } from './highlight/highlight';

@NgModule({
  declarations: [
    DayMonth,
    Weekday,
    HighlightPipe,
    Min2duration
  ],
  imports: [ ],
  exports: [
    DayMonth,Weekday,HighlightPipe,Min2duration 
  ]
})
export class PipesModule {}

1 个答案:

答案 0 :(得分:1)

确保在自定义NgModule中导入pipes.module,其中声明了自定义组件。