angular - 在 Angular 2 + Immutable.js 中迭代(使用 *ngFor)

标签 angular typescript immutable.js

我将 Angular 2 与 Immutable JS 一起使用,但我似乎无法在我的模板中使用简单的 for 循环。真令人沮丧。我尝试了以下旧语法(基于教程)

<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"

编辑:以下有效但看起来很糟糕

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

最佳答案

这对我有用:

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

关于angular - 在 Angular 2 + Immutable.js 中迭代(使用 *ngFor),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40311753/

相关文章:

javascript - Angular 5 使用标签到页面 anchor 的路由

angular - Ionic : Typescript Error in App. Component.Ts 新增功能

twitter-bootstrap - 我在 "ngx-bootstrap"和 "@ng-bootstrap/ng-bootstrap"之间感到困惑

typescript - TypeORM- findOne 返回意外值

reactjs - React/Redux 中树结构和 shouldComponentUpdate 的性能问题

javascript - 更新 Immutable.js 列表中的所有对象

javascript - typescript 的类型安全 Immutable.Js getIn

angular - BrowserAnimationsModule 在核心模块中导入时不起作用

javascript - Angular 8在页面加载后添加类错误: ExpressionChangedAfterItHasBeenCheckedError

checkbox - Angular 2 polymer 和 PaperChechboxSelectedDirective