2017-05-14 16 views
1

角度でパイプを実装しようとしています。実現後、ngForはマップでは動作しません。いくつかの調査では、将来の機能がそれに対処するようになったと考えられましたが、その間にmapToIterableパイプが答えでした。TypeScriptを使用した角パイプのMapToIterable

私は次のコードを持っている:

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

@Pipe({ 
    name: 'mapToIterable' 
}) 
export class MapToIterablePipe implements PipeTransform { 
    transform(map: Map<string, Object>, args: any = []): any { 
    const a: any[] = []; 
    console.log(map.keys()); // <- works as expected 
    for (const k in map) { 
     if (map.has(k)) { 
     console.log("hello"); // <- never executes 
     console.log(k); 
     a.push({key: k, val: map.get(k)}); 
     } 
    } 
    console.log(a); // <- always empty 
    return a; 
    } 
} 

export const MAPTOITERABLE_PROVIDERS = [ 
    MapToIterablePipe 
]; 

map.keysは()私が正しいキーのリストを与えるが、他には何も働きません。

私のループがアレイを正しく満たしていない理由を診断する方法の提案はありますか?

答えて

3

Map 'keys'はオブジェクトキーではなく、Object.keys()またはin演算子では取得できません。 map.keys()は反復可能を返し、それが原因活字体が拡散演算子を実装する方法に

for (const key of Array.from(map.keys())) { 
    // this check is unneeded 
    // if (map.has(k)) { 
    ... 
} 

またはTypeScript 2.3 with downlevelIteration optionで、

for (const key of map.keys()) { ... } 

それとも

const a: any[] = Array.from(map.entries()).map(([key, val]) => ({ key, val })); 

なければならないことを考慮すると

[...iterable] 012と同じように動作しませんは2.2以下です。

関連する問題