简体   繁体   English

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

[英]Pipe not found in custom component - Ionic 3 (Lazy Loading)

In my ionic 3 project I have my pipes wrapped in a pipes.module.ts and importing it in @NgModule for all my lazy loaded pages - works fine without issues. 在我的ionic 3项目中,我将管道包裹在pipes.module.ts中,并将其导入所有延迟加载页面的@NgModule中-正常工作而没有问题。

However using the same approach in my custom component, using pipe inside the component template results in an error: 但是,在我的自定义组件中使用相同的方法时,在组件模板内使用管道会导致错误:

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

I tried also importing the pipe individualy in my component's .module.ts , but still same issue. 我也尝试将管道单独导入到组件的.module.ts中,但仍然是同样的问题。 The only way i made it work was to import the pipe in my components .ts file , wrap it in a function and us this function like this: 我使它起作用的唯一方法是将管道导入到我的components.ts文件中,将其包装在一个函数中,然后使用以下函数:

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

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

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

and in template 并在模板中

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

This way it works, but it doesn't feel like a proper solution, especially as i am using more pipes and more custom components in my project. 通过这种方式,它就可以工作,但感觉不像是一个合适的解决方案,尤其是当我在项目中使用更多管道和更多自定义组件时。

Is there a way to make the pipe work also inside a custom component's template like this? 有没有办法像这样在自定义组件的模板中使管道也能正常工作?

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

Edit: 编辑:

pipes.module.ts pipe.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 {}

确保在定义自定义组件的自定义NgModule中导入pipe.module。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM