I have a simple little component that happens to have its own "api", a method it exports from its viewmodel so that containers can interact with it. I needed to be able to call it, but couldn't figure out how.
The Cheat Sheet clearly indicates that you can use ref to create a reference to a view model, but I never thought about the implications, since the only time I had used ref was to use that reference in the HTML in a view-only control. But this ref that you create is also usable from the view model of the container. That means, I can do this:
<my-image url.bind="bannerImageUrl" view-model.ref="image"></my-image>
and then reference it from the container javascript, like this:
this.image.doSomething();
It turns out that using ref just adds that name to your view model, as a reference to that entity. This is pretty cool, since you can do:
ref="someIdentifier"
orelement.ref="someIdentifier"
- This gets you the HTML element from the DOM, which means that you can manipulate is from both your HTML and your javascript.attribute-name.ref="someIdentifier"
- This gets you the view model for a custom attribute. Since this is a javascript object, you can do anything with it you would expect.view-model.ref="someIdentifier"
- This gets you the view model for a custom attribute. Again, this is just javascript, hack away!view.ref="someIdentifier"
- This gets you the View object behind the custom element's view. As teh docs say, this is not the DOM element (you use ref for that) but rather a class from the Aurelia framework that you acn leverage to query and manipulate the view. This class is documented in the templating section of the docs.controller.ref="someIdentifier"
- This gets you the controller for the custom element. Again, this class is documented in the templating section of the docs.
I think that I shall never plumb the depths of the binding system for Aurelia. There is almost nothing you cannot do, it seems.
1 comment:
you have a mistake in view-model.ref... it's for custom element not for attribute
Post a Comment