angular2 - 管错误

Question

我有这个PipeGalleryFilter.ts：

import { Pipe,Injectable,PipeTransform } from '@angular/core'; 
@Pipe({ 
    name: 'galleryfilter', 
    pure: false 
}) 
@Injectable() 
export class PipeGalleryFilter implements PipeTransform { 
    transform(items: any[], args: any[]): any { 
     return items.filter(item => item.type.indexOf(args[0].type) !== -1); 
    } 
}///@@ 

然后我把它添加到我的Gallery：

HTML

<masonry-brick class="brick50" *ngFor="let brick of bricks | galleryfilter: gallery_args"> 
    <img src="{{brick.img}}" alt=""> 
</masonry-brick> 

TS

gallery_args = {type: 'magazine'}; 

bricks = [ 
    {title: 'Brick 1',img:"assets/img/img003.jpg",type: "magazine"}, 
    {title: 'Brick 2',img:"assets/img/img004.jpg",type: "magazine"}, 
    {title: 'Brick 3',img:"assets/img/img005.jpg",type: "newspaper"}, 
    {title: 'Brick 4',img:"assets/img/img003.jpg",type: "newspaper"}, 
    {title: 'Brick 5',img:"assets/img/img004.jpg",type: "newspaper"}, 
    {title: 'Brick 6',img:"assets/img/img005.jpg",type: "newspaper"}, 
    {title: 'Brick 1',img:"assets/img/img003.jpg",type: "movies"}, 
    {title: 'Brick 2',img:"assets/img/img004.jpg",type: "commercials"}, 
    {title: 'Brick 3',img:"assets/img/img005.jpg",type: "commercials"}, 
    {title: 'Brick 4',img:"assets/img/img003.jpg",type: "commercials"}, 
    {title: 'Brick 5',img:"assets/img/img004.jpg",type: "lifestyle"}, 
    {title: 'Brick 6',img:"assets/img/img005.jpg",type: "lifestyle"} 
    ]; 

但我不断收到：

例外：错误./Gallery类画廊 - 联模板：22：39 造成的：无法读取未定义

我的财产 '类型'有人怀疑它与return items.filter(item => item.type.indexOf(args[0].type) !== -1);行有关系，但我不知道如何做到正确。

我该如何解决这个问题？

Answer 1

由于gallery_args是一个对象（与您在问题中显示的相同），而不是array，所以gallery_args[0]当然是未定义的。

修改您transform功能：

transform(items: any[], args: any): any { // Note that the type of args should be any or {} 
    return items.filter(item => item.type.indexOf(args.type) !== -1); 
}