Angular 2-Jquery |使用鼠标位置添加样式(顶部/左侧) [英] Angular 2 - Jquery | Adding styles (top/left) with a mouse position

问题描述

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

I'm looking for a way to add a div component in Angular 2 at a specific place (mouse event x/y).

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

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

我将职位传递到拒绝类中，但是我不知道如何从中做出样式?我检查了有角度的文档，但我只能设置布尔值和固定的CSS值/类.我想做这样的事情:

i pass the position into my reject class, but i do not know how to make styles out of it ? I checked angular docs but i can only set booleans and fixed css values / classes. I would like to do something like this:

[style]="rejectPosition"

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

但是不可能. 有Angular 2可以做到这一点吗?

But its not possible. Is there a Angular 2 way to do this?

我找到了一种无需拒绝组件的方法，只是使用jQuery对其进行内联样式设置，但是我不喜欢这种方法.

I found a way to do it without the reject Component, that just styles it inline with jQuery, but i do not like this approach.

推荐答案

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

这篇关于Angular 2-Jquery |使用鼠标位置添加样式(顶部/左侧)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！