在Angular 2 + Immutable.js中进行迭代(使用* ngFor) [英] Iterating in Angular 2 + Immutable.js (using *ngFor)

查看:47
本文介绍了在Angular 2 + Immutable.js中进行迭代(使用* ngFor)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I'm using Angular 2 with Immutable JS, but I can't seem to get a simple for-loop to work in my template. It's really frustrating. I tried the following old syntax (based on tutorials)

<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看起来像:

filterArray looks like:

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

我需要使用一些特殊的语法来使它起作用吗?浏览器无任何显示,使用let语法时也没有错误.

Is there some special syntax I need to use so that this works? Nothing is displaying on my browser, and I get no errors when using the let syntax.

版本:

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

以下方法可行,但看起来很糟糕

the following works but it looks bad

  <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 2 + Immutable.js中进行迭代(使用* ngFor)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆