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); 
}