在管道中的@Component不工作angular2

[]错误

[错误消息] 参数类型的“{选择：字符串; templateUrl：string;管道：任何[]; }'不能分配给'Component'类型的参数。对象字面量只能指定已知属性，而'管道'在类型'组件'中不存在。

通知，list.component.ts

import {Component, OnInit} from '@angular/core'; 
import {ocNotice} from './product'; 
import {NoticeFilterPipe} from './product-filter.pipe'; 
import {NoticeService} from './product.service' 

@Component({ 
    selector : 'pm-products', 
    templateUrl : './app/products/product-list.component.html', 
    pipes: [ noticeFilter ] 
}) 

export class ProductListComponent{ 
    pageTitle : string = 'Notice List'; 
    imgW : number = 30; 
    imgH : number = 30; 
    showImage : boolean = false; 
    listFilter : string; 
    notice : ocNotice[]; 

constructor(private _noticeService : NoticeService){ 

} 
toggleImage() : void{ 
    this.showImage = !this.showImage; 
} 

ngOnInit() : void{ 
    console.log("Oninit"); 
    this.notice = this._noticeService.getProduct(); 
}

产品filter.pipe.ts

import {PipeTransform, Pipe} from '@angular/core'; 
import {ocNotice} from './product'; 

@Pipe({ 
    name : 'noticeFilter' 
}) 

export class NoticeFilterPipe implements PipeTransform{ 
    transform(value : ocNotice[], args : string) : ocNotice[]{ 
     let filter : string = args[0] ? args[0].toLocaleLowerCase() : null; 
     return filter ? value.filter((notice : ocNotice) => 
      notice.title.toLocaleLowerCase().indexOf(filter) != -1) : value; 
    } 
}

来源

2017-02-14 skj

您正在以错误的方式引入管道。阅读我的答案并按照说明进行操作：http://stackoverflow.com/questions/42093552/can-i-make-global-registration-pipe-guard-for-global-access/42094880#42094880 –

首先，您应该在你的'module'中声明'pipe'。现在，如果你假装在你的'.ts - component'文件中使用'pipe'，你必须将它：'pipes：[noticeFilter]'改为：'providers：[NoticeFilterPipe]'。如果你想在* template *中使用它，你只需要在你的'module'中声明它。 – developer033

你使用什么版本的Angular 2？据我所知，'pipe'不再在'component'文件中声明;它必须在'module'的'declaration'中声明。 –

，如果你得到这个错误：

类型的参数“{选择：字符串; templateUrl：string;管道：typeof MattDamon []; }'不能分配给'Component'类型的参数。对象字面量只能指定已知属性，而'管道'在类型'组件'中不存在。

代替在@Component []阵列中的管道将所述管的，添加管内“app.modules.ts”的“声明”阵列中，并且无需使用“管道”阵列

来源

2018-01-15 10:33:02 gischy

在管道中的@Component不工作angular2

回答

相关问题