角度2ng 表示第一个，最后一个，索引循环

我试图将这个例子中的第一个匹配项设置为 default: 噗通

得到以下错误:

    Unhandled Promise rejection: Template parse errors:
TypeError: Cannot read property 'toUpperCase' of undefined ("dButtonToggleGroup">
<md-button-toggle [ERROR ->]*ngFor="let indicador of indicadores; #first = first" value="indicador.id" [checked]="first">"): ng:///AppModule/HomeComponent.html@35:78
Parser Error: Unexpected token #, expected identifier, keyword, or string at column 31 in [let indicador of indicadores; #first = first] in ng:///AppModule/HomeComponent.html@35:78 ("<md-button-toggle *ngFor="let indicador of indicadores; #first = first" value="indicador.id" [ERROR ->][checked]="first">
<span>{{ indicado"): ng:///AppModule/HomeComponent.html@35:153

怎么了？

205303 次浏览
小开
最佳答案

看看这个 噗通。

在绑定到变量时，需要使用括号。另外，当您希望获得对 html 中元素的引用时，可以使用 hashtag，而不是像那样在模板中声明变量。

<md-button-toggle *ngFor="let indicador of indicadores; let first = first;" [value]="indicador.id" [checked]="first">

编辑: 感谢 Christopher Moore: Angular 公开了以下局部变量:

  • index
  • first
  • last
  • even
  • odd
小开

下面是它在角度6中是如何完成的

    <li *ngFor="let user of userObservable ; first as isFirst">
<span *ngIf="isFirst">default</span>
</li>

注意从 let first = first到 first as isFirst的变化

小开

通过这个你可以得到任何指数在 *ngFor环在角..。

<ul>
<li *ngFor="let object of myArray; let i = index; let first = first ;let last = last;">
<div *ngIf="first">
// write your code...
</div>


<div *ngIf="last">
// write your code...
</div>
</li>
</ul>

我们可以在 *ngFor中使用这些别名

  • index : number: let i = index获取对象的所有索引。
  • first : boolean: let first = first获取对象的第一索引。
  • last : boolean: let last = last获取对象的最后索引。
  • odd : boolean: let odd = odd得到对象的奇数索引。
  • even : boolean: let even = even得到对象的偶数索引。
小开

遗憾的是，如果 ngFor 要显示许多数据库条目，last 不起作用。如果将\{\{ last }}添加到正在列出的项，以便可以查看其内容，则会看到每隔一段时间，last 就为 true，然后更改为 false。当显示实际的最后一项时，最后一项显示为 true，上面的所有其他项显示为 false。这意味着“ last”为 true，即使没有显示最后一项。


提交答案