Angular 2 - jQuery |使用鼠标位置添加样式（上/左）

Posted 2023-03-13

【中文标题】Angular 2 - jQuery |使用鼠标位置添加样式（上/左）

【英文标题】：Angular 2 - Jquery | Adding styles (top/left) with a mouse position

【发布时间】：2016-09-19 06:10:07

【问题描述】：

我正在寻找一种在 Angular 2 中在特定位置（鼠标事件 x/y）添加 div 组件的方法。

https://jsfiddle.net/lennartquerter/w2c7uqw6/

this.xPos = xPos;
this.yPos = yPos;

我将职位传递给我的拒绝类，但我不知道如何从中制作样式？我检查了角度文档，但我只能设置布尔值和固定的 css 值/类。我想做这样的事情：

[style]="rejectPosition"

this.rejectPosition = "left: " + this.xPos + "px ; top: " + this.yPos + "px;"

但这是不可能的。 有没有 Angular 2 方法可以做到这一点？

我找到了一种不使用拒绝组件的方法，只需将其样式与 jQuery 内联，但我不喜欢这种方法。

【参考方案1】：

[style.left.px]="xPos" [style.top.px]="yPos"

【讨论】：

似乎什么也没做。

哦不！我不得不把它改成 style.top.px="reject.xPos" ！

或者 [style.left.%] 如果你想使用百分比

我没试过，但我猜像em、vh、...这样的所有单位都支持。

你好，我试过这个。它在 Chrome 和 firefox 中工作，但在 IE 11 中不工作