Question

我对Angular 2和打字稿缺乏了解，这让我想到了这个问题：

我想要一个数据表（已经导入好了）一年中所有月份都放在横坐标上，而一些DB对象放在纵坐标上（这没关系）。

我不知道如何以及在何处声明我的月份列表以及如何在我的HTML中浏览它。这一刻，我有这个：

Component.ts：

  public months= {
    1:'Janvier',
    2:'Février',
    3:'Avril',
    etc...
    12:'Decembre'
  };

Component.html

<td *ngFor="let month of months">{{month}}</td>

你能帮助我让它工作（显示至少一个月的原始数据）并尽可能干净吗？我非常确定在课堂上直接宣布一个月的清单并不是一件好事......

感谢您阅读

Answer 1

你必须做几个月的数组。目前你有一个对象。

<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/4.1.0/rx.all.js"></script>

或者如果你真的想拥有一个对象，你可以实现自定义管道：

public months = ["Janvier", "Février", "Avril"...];

然后您可以将其用作：

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

@Pipe({
   name: 'keyObject'
})
@Injectable()
export class KeyObjectPipe {

transform(value, args:string[]):any {
    let keys = [];
    for (let key in value) {
        keys.push({key: key, value: value[key]});
    }
    return keys;
}
}

Answer 2

或者，您可以使用这种方式

months= [
      { 'id' :1 , 'name':'Janvier'},
      { 'id' :2 , 'name':'Février'},
      { 'id' :3 , 'name':'Avril'}
    ];

在 ngFor 中访问它，如下所示

<div *ngFor="let month in months">
      {{month.name}}</div>
</div>

Answer 3

为什么不在视图中使用索引？

在你的TS中：

months = ["Janvier", "Février", "Avril"...];

在您的HTML中：

<div *ngFor="let month of months; let i = index">
        <p>Month(string): {{month}}</p>
        <p>Month(number): {{i+1}}</p>
</div>

使用＆nbsp; ngFor＆＃39;浏览一系列月份。指示

3 个答案: