Итерация в угловом 2 + Immutable.js (с использованием * ngFor)

Question

Я использую Angular 2 с неизменяемым JS, но я не могу заставить простую петлю работать в моем шаблоне. Это действительно расстраивает. Я пробовал следующий старый синтаксис (на основе учебных пособий)

<div *ngFor='#filter of filterArray' class='filter-row'> 
    <div class='row-title'>{{filter.get(title)}}</div> 
</div> 

и нового синтаксис

<div *ngFor=' let filter of filterArray' class='filter-row'> 
    <div class='row-title'>{{filter.get(title)}}</div> 
</div> 

Я попытался с и без .get синтаксиса для неизменных карт в фигурных скобках, и я просто не могу заставить его работать ..

filterArray выглядит следующим образом:

this.filterArray = fromJS([{ 
    title: 'Brand', 
}, 
{ 
    title: 'Category' 
}, 
{ 
    title: 'Each UPC' 
}]); 

Есть ли какой-то специальный синтаксис, который мне нужно использовать, чтобы это сработало? В моем браузере ничего не отображается, и я не получаю ошибок при использовании синтаксиса let.

Версии:

"@angular/common": "^2.1.0", 
"@angular/compiler": "^2.1.0", 
"@angular/core": "^2.1.0", 
"@angular/forms": "^2.1.0", 
"@angular/http": "^2.1.0", 
"@angular/platform-browser": "^2.1.0", 
"@angular/platform-browser-dynamic": "^2.1.0", 
"@angular/router": "^3.0.1", 
"immutable": "^3.8.1", 
"typescript": "2.0.2" 

Edit: следующие работы, но это выглядит плохо

<div *ngFor='let filter of filterArray let i=index' class='filter-row'> 
    <div class='row-title'>{{filterArray.get(i).get('title')}}</div> 
    </div> 

Answer 1

Это работает для меня:

<div *ngFor='let filter of filterArray' class='filter-row'> 
    <div class='row-title'>{{filter.get('title')}}</div> 
</div>