Skip to content

.bindings(props) method

Choose a tag to compare

@justinbmeyer justinbmeyer released this 19 Jun 17:32
· 170 commits to master since this release

This adds a .bindings method to instances of StacheDefineElement elements. This method is used to setup directional bindings from observable values to properties on the StacheDefineElement.

Call .bindings(props) with properties and single value observables.

The following establishes a binding between the me observables properties and the myElement's properties:

import {DefineObject, value} from "can";

var me = new DefineObject({
  first: "Justin",
  last: "Meyer"
});

var myElement = new MyElement();

myElement.bindings({
  firstName: value.from(me,"first"),
  lastName: value.to(me, "last")
})

These bindings are only activated while the element is initialized. So myElement.firstName would not be
set to "Justin" until the element is initialized (which happens when the element is inserted into the document):

document.body.append(myElement);

myElement.firstName //-> "Justin"

For memory safety, those bindings are torndown when the element is removed from the page:

myElement.remove();

me.first = "Ramiya"

// myElement is not updated
myElement.firstName //-> "Justin"