Just installed MeirionHughes/aurelia-resize

Help Requests
1

I’ve installed the above from HERE and installed it with PLATFORM etc and its, I believe installed correctly.

  aurelia.use
      .standardConfiguration()
      .plugin(PLATFORM.moduleName('bcx-aurelia-dnd'))
      .plugin(PLATFORM.moduleName('aurelia-fontawesome'))
      .plugin(PLATFORM.moduleName('aurelia-resize'))

As the usage says I placed resizeable resize.trigger="foo($event.detail)" on the div I want to check for resize and then placed in that custom elements VM:

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

I got this error:
TS2581: Cannot find name '$'. Do you need to install type definitions for jQuery? Trynpm i @types/jquery.

Do I need to add jquery for this to work? I have it as part of bootstrap but do I need to add this to the VM and if I do how?

Simon

1 Like
2

I managed to get rid of the error above however I cannot for the life of me get this to work… I have a custom element that I need to know whether its size has changed. I thought this option might work but after setting it up exactly as suggested in the notes on usage - making sure that foo is set to “public” - I get the error foo is not a function. (I even tried setting the function to @bindable but that didnt work either):

Here is how I have set up the view:
<calendar resizeable resize.trigger="foo($event.detail)"></calendar>

1 Like
3

I have figured this out… I have a number of nested divs along with using grid. I needed to set another div in the same place as the grid area I wanted to measure. My biggest screw up was not placing the foo function on the correct VM… Ive got a few… once I was able to do that I was able to get a handle on the width of the div as it changed. Thanks for viewing. Simon

2 Likes