使用ngFor索引增加[ngStyle] attr?

sin*_*095 9 javascript typescript angular

我正在尝试使用ngFor动态创建多个元素,然后根据绘制的数量设置top属性.

我想知道是否有办法在ngStyle的同一div上访问ngFor的索引?即;

<div class="row" *ngFor="let d of data; let i = index;" [ngStyle]="{'top': mrTop*i}" >

如果没有,任何建议如何我可以实现类似的东西?

我宁愿避免添加另一个div;

<div *ngFor="let d of data; let i = index;">
  <div class="testCase" [ngStyle]="{'top': mrTop*i}">{{d}}</div>
</div>
Run Code Online (Sandbox Code Playgroud)

(虽然这也不起作用)

我想知道是否有办法将事件监听器附加到循环事件,以便在幕后我可以mrTop为每个绘制的div 增加变量?

无论如何,我不确定如何最好地接近这一点,并希望得到一些帮助/建议.

插在这里

Sas*_*sxa 6

你的mrTop变量是一个字符串,你不能乘以它.

尝试:

public mrTop = 10;
Run Code Online (Sandbox Code Playgroud)

然后

<div [ngStyle]="{'top': mrTop*i + '%'}">
Run Code Online (Sandbox Code Playgroud)

要么

<div [style.top.%]="mrTop*i">
Run Code Online (Sandbox Code Playgroud)