嵌套的div无法更新位置ngStyle

时间:2018-07-18 13:02:13

标签: html css json angular

我正在尝试在3D对象上覆盖标签。

对象是由房间组成的建筑物的楼层。我希望每个房间都有一个房间号标签。但是,房间号的位置默认为“级别”标签位置。看来信息正确地从JSON中撤出了,但是无论我输入什么,位置都在父元素的右边,就像它们在同一行一样。

这是HTML

<div class='label-parent' *ngFor="let level of info.levels" [ngStyle]="{'left':getLabelLeft(level)+'px', 'top':getLabelTop(level)+'px', 'font-size':getLabelSize(level)+'px', 'display':getDisplayForLabel(level)}">
  <div class='level-label'>{{level.name}}</div>
  <div class='room-parent' *ngFor="let room of level.rooms" [ngStyle]="{'left':getRoomLabelLeft(room)+'px', 'top':getRoomLabelTop(room)+'px', 'font-size':getLabelSize(level)+'px', 'display':getDisplayForLabel(level)}">>
    <div class='room-label'>{{room.name}}</div>
  </div>
</div>

我要从中提取的JSON

"vertical_field_view": 3.99,
"levels": [{
  "name": "Floor1",
  "model_names": ["Building"],
  "offset": {
    "translation": {
      "x": 0,
      "y": 0,
      "z": 0
    }
  },
  "rooms": [{
      "name": "Room 117",
      "translation": {
        "x": 27,
        "y": 12,
        "z": 12
      }
    },
    {
      "name": "Room 118",
      "translation": {
        "x": 38.5,
        "y": 10,
        "z": 10
      }
    }
  ],
  "isb_bounds": {
    "minx": -15,
    "maxx": 63,
    "minz": -3,
    "maxz": 60
  },
  "label_offset": {
    "x": 24,
    "y": 0,
    "z": -2
  },
  "label_height": 2.5
}],

0 个答案:

没有答案