Html 将样式设置为仅使用*ngFor创建的第一个元素_Html_Css_Angular_Ngfor

Html 将样式设置为仅使用*ngFor创建的第一个元素

html css angular

Html 将样式设置为仅使用*ngFor创建的第一个元素,html,css,angular,ngfor,Html,Css,Angular,Ngfor,我使用下面的代码来显示一些*字符 <div *ngFor="let line of lines;let i=index">*</div> 如何将其仅应用于使用*ngFor创建的第一个元素？如果您切换到使用css类，那么它很简单： [class.first]="i === 0" 否则，请使用ngIf（ngIfThen/ngIfElse）。ngFor首先提供 <div *ngFor="let line of lines;let i=index; first as

我使用下面的代码来显示一些

字符

  <div *ngFor="let line of lines;let i=index">*</div>

如何将其仅应用于使用

*ngFor

创建的第一个元素？

如果您切换到使用css类，那么它很简单：

[class.first]="i === 0"

否则，请使用

ngIf

（

ngIfThen

ngIfElse

）。

ngFor

首先提供


<div *ngFor="let line of lines;let i=index; first as isFirst"
    [style.margin-left.px]="isFirst ? marginVar : 0">*</div>

*

或者使用CSS
<div *ngFor="let line of lines;let i=index; first as isFirst"
    [class.first]="isFirst">*</div>

*

有关所有*ngFor
变量，请参阅
你试过使用ngIf吗？我已经考虑过了，但我不确定如何在ngIf指令中包装[style.margin left.px]=“marginVar”。你可以尝试同时使用ngStyle和ngIf
<div *ngFor="let line of lines;let i=index; first as isFirst"
    [class.first]="isFirst">*</div>