试图让 style="margin-left:{{data}};" 工作

Question

index.ts
bubbles: any [][] = [['80%','Meeting'],['20%','Meeting']]

index.html
<div *ngFor="let bubble of bubbles">
      <div class="bubble" style="margin-left:{{bubble[0]}};">
      </div>
</div>

我正在尝试让 margin-left 样式使用数组 bubbles[0] 中的数据。

for 循环在该布局中提供 ['80%','Meeting']，因此我尝试将该数组的 0 元素设置为 margin-left 样式，但这不起作用。还有其他方法可以完成此过程吗？

Answer 1

使用 [ngStyle] 而不是 style。文档 here.

<div class="bubble" [ngStyle]="{'margin-left': bubble[0]}">

Answer 2

除了@Pengyy的回答，还可以用

<div class="bubble" [style.margin-left]="bubble[0]">

试图让 style="margin-left:{{data}};" 工作

Trying to get style="margin-left:{{data}};" to work

html

css

margin

ngfor

angular