@Component({
selector: '.donation',
template: `
<figure id="donation" move>
<img src="image/qrcode.png"/>
<figcaption>
Buy me a cup of coffee.
</figcaption>
</figure>
`
})
export class DonationComponent{}
@Directive({
selector: '[move]'
})
export class MoveDirective{}
嘿,我想在MoveDirective和DonationComponent中获取元素的宽度/高度,我读了几次文档,但仍然找不到解决这个问题的方法。有人知道这一点请帮帮我,非常感谢!
您可以如下所示使用ElementRef,
演示:https : //plnkr.co/edit/XZwXEh9PZEEVJpe0BlYq? p =preview检查浏览器的控制台。
import { Directive,Input,Outpu,ElementRef,Renderer} from '@angular/core';
@Directive({
selector:"[move]",
host:{
'(click)':"show()"
}
})
export class GetEleDirective{
constructor(private el:ElementRef){
}
show(){
console.log(this.el.nativeElement);
console.log('height---' + this.el.nativeElement.offsetHeight); //<<<===here
console.log('width---' + this.el.nativeElement.offsetWidth); //<<<===here
}
}
您可以在需要时在组件本身中使用它的方式相同。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句