Javascript Aurelia:视图的调整大小/布局更改事件？

是否有一种订阅视图的方法，以便在Aurelia中观察调整大小/布局事件？我有一个画布，我想调整大小。我想知道是否有一种“奥雷莉亚”的方法可以做到这一点

我试过：

<div ref="canvasContainer" class="widget-dial-container" resize.delegate="doresize()">
  <canvas ref="canvas" class="widget-dial-canvas" />
</div>

但它从不调用我的

doresize（）

方法

---

我已经尝试绑定到DOM offsetWidth和offsetHeight，但是这也不起作用（在vm中有和没有

@bindable canvascanner；

）

正如Kruga所提到的，

resize

事件只在

窗口本身上受支持。您可以使用Aurelia平台抽象层的
platform
对象以跨平台的方式连接到它。您必须运行
jspm install aurelia pal
才能获得它。如果您不担心跨平台，那么您可以使用
窗口
对象

下面的模板和VM适合我。我在调整大小计时器上实现了一个节流阀：

HTML

我制作了一个附加组件，它使用了一个包
npm:element resize detector
。这将检测对div大小的所有更改，包括来自css动画的更改


安装它：

npm install aurelia-resize --save

将其添加到您的配置中：

export function configure(aurelia) {
  aurelia.use
    .standardConfiguration()
    .plugin('aurelia-resize');

在视图模型上添加方法：

foo(detail){
    console.log("width=" + detail.width);
    console.log("height=" + detail.height);
    console.log("old width=" + detail.widthOld);
    console.log("old height=" + detail.heightOld);
}

然后通过添加
resizeable
属性并绑定到resize事件来使用它

<div resizeable resize.trigger="foo($event.detail)">


你不能在div上使用resize事件，这就是为什么我要问aurelia是否想出了一个方法。嗨，Ashley，你能帮我解决这个问题吗？我不是一个网页专家，但我让我们的网页专家来看看。拯救了这一天@merion hughes。我在一个画布上遇到了完全相同的问题，该画布的容器在父级上使用show.bind（）设置为零宽度。当div变得可见时，我需要调整画布的大小。在无意中发现这篇文章之前，我找不到这样做的方法。现在，我调用resize方法来响应容器宽度的变化。非常感谢。
foo(detail){
    console.log("width=" + detail.width);
    console.log("height=" + detail.height);
    console.log("old width=" + detail.widthOld);
    console.log("old height=" + detail.heightOld);
}

<div resizeable resize.trigger="foo($event.detail)">