CODEWITHSUNDEEP
aurelia
weagle08
weagle08

Reputation: 1964

access to jquery methods on components within Aurelia

I'm using modals from bootstrap within my Aurelia application and would like to hide/show the modal from my view model. I can make it work by just using jquery in my vm as so:

$('#myModal').modal('show');

but would prefer a more "Aurelia Way" type method such as: <div id="myModal" ref="myModal" ...> ... </div>

and in the vm do this: this.myModal.modal('show');

however when i do the below I get just the DOM element with none of the prototype methods on it. How can this be achieved in Aurelia?

Upvotes: 0

Views: 254

Answers (1)

Jeremy Danyow
Jeremy Danyow

Reputation: 26406

Add a ref binding command to your view. This will give the view model a reference to the DOM element that is the bootstrap modal.

<div ref="myModal" ...>
  ...
</div>

In your view model, $(this.myModal).modal('show') will show the modal.

You could also use the aurelia-dialog plugin

Upvotes: 1

Related Questions