パイプ内の未定義品目をチェックする方法は？

Question

私は次のように私の項目をフィルタリングするために、カスタムパイプでAngular2を使用します。

transform(value: any, args: string[]): any { 
    if (args) { 
     return value.filter(foo => foo.url.indexOf(args) != -1) 
    }; 
    return value; 
} 

私foo.url項目のいくつかは未定義であると、私はこのエラーを得た：

TypeError: Cannot read property 'indexOf' of undefined

私がいるかどうかを確認することができますどのようにプロパティは定義されておらず、フィルタリングされますか？

Answer 1

あなたはこの試みることができる：あなたが ``（！のfoo.url）場合は使用以外にも意味

transform(value: any, args: string[]): any { 
    if (args) { 
    return value.filter(foo => { 
     return (foo.url && (foo.url.indexOf(args) != -1)); 
    }); 
    } 
    return value; 
} 

Answer 2

あなたはタイプスクリプトを使用していますので、それに付随するすべての利点を利用し始めましょう。このtransformファンクションにanyタイプのパラメータを指定する代わりに、タイプを指定します。これは、このような愚かなランタイムの問題を緩和するのに役立ちます。あなたは明らかにvalueパラメータが配列であると仮定しているので、それを1として宣言します（戻り型についても同じことを行います）。その後、アレイのどのタイプそれがある、のはこのことを実証してみましょう...代わりに：

transform(value: any, args: string[]): any { 
    if (args) { 
     return value.filter(foo => foo.url.indexOf(args) != -1) 
    }; 
    return value; 
} 

さんはこのようにそれを書いてみましょう：

：

transform(value: Foo[], args: string[]): Foo[] { 
    if (args) { 
     return value.filter(foo => foo.url.indexOf(args) != -1) 
    }; 
    return value; 
} 

その後、我々はFooを表すクラスを持つことができます

export class Foo { 
    constructor(url: string); 
} 

実行時にプロパティurlがundefinedであるランタイムの問題を防ぐのに役立ちます。