Question

在下面的代码中

。 simple-point-box css类生成具有拖放功能的简单框。 N号简单的盒子存储在items数组中。在这里，我正在迭代包含按钮和正确值的每个项目。根据它，我想定位每个项目的位置。我想通过使用样式标签通过从每个项目分配底部和右侧的值来做到这一点。请帮我。我被困住了。

<div id="widgetspace"
        class="simple-point-box"
        *ngFor="let item of items"
        ngDraggable ngResizable (started)="onStart($event)" (stopped)="onStop($event)" (movingOffset)="onMoving($event)"
        [preventDefaultEvent]="true" (endOffset)="onMoveEnd($event,item,'widgetspace')" ##style="bottom: 200px; right: 300px"##>
  <br>
  bottom={{item.bottom}}
  left={{item.right}}
</div>

我只需要根据项目包含值更改样式标签值即可。这样每个项目都会按照其保存的位置进行定位

Answer 1

您无需添加##使用简单样式

<div id="widgetspace"
        class="simple-point-box"
        *ngFor="let item of items"
        ngDraggable ngResizable (started)="onStart($event)" (stopped)="onStop($event)" (movingOffset)="onMoving($event)"
        [preventDefaultEvent]="true" (endOffset)="onMoveEnd($event,item,'widgetspace')" style="bottom: 200px; right: 300px">

如果您希望使用动态样式，则可以将ngStyle用于该目的，例如

<div id="widgetspace"
        class="simple-point-box"
        *ngFor="let item of items"
        ngDraggable ngResizable (started)="onStart($event)" (stopped)="onStop($event)" (movingOffset)="onMoving($event)"
        [preventDefaultEvent]="true" (endOffset)="onMoveEnd($event,item,'widgetspace')"  [ngStyle]="{'bottom': yourBottomProperty,'right': yourRightProperty}">

我想使用样式标签覆盖css类属性。动态更改样式标签值

1 个答案: