绑定到元素的大小(div) [英] Bind to size of element (div)
本文介绍了绑定到元素的大小(div)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个具有Width和Height属性的组件.如何将组件的视图高度和宽度绑定到这些属性?
I have a component with Width and Height properties. How can I bind component's view height and width to these properties?
只要组件尺寸也发生变化,我就需要更新它们,即通过调整浏览器窗口的大小.
I need them to be updated whenever component size changes too, i.e. by re-sizing the browser window.
推荐答案
使用(window:resize)="onResize($event)"
监听全局事件.您可以使用window
,document
或body
作为目标.参见此小品
Use (window:resize)="onResize($event)"
to listen to global events. You can use window
, document
or body
as targets. See this plunk
@Component({
selector: 'my-app',
template: `
<div
class="square"
[style.width.px]="width"
[style.height.px]="height"
(window:resize)="onResize($event)"
></div>
`
})
export class App {
width = 100;
height = 100;
onResize(event) {
this.width += 100;
this.height += 100;
}
}
这篇关于绑定到元素的大小(div)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文