One-way bind a value from the viewModel or element to the parent scope.
Parameters are the same as childProp:to="key"
Parameters are the same as child-prop:to="key"
If the element does not have a ViewModel, listens to an event on the element and binds binds the element’s value to the SCOPE_VALUE when that event occurs.
A viewModel or DOM event.
A value in the current scope.
Depending on whether the element has a ViewModel,
:to bindings change
between exporting ViewModel properties or DOM properties.
Exporting ViewModel properties
childProp:to="key" can be used to export single values or the complete view model from a
child component into the parent scope. Typically, the values are exported to the references scope.
The following example connects the selected driver in
<drivers-list> with an editable plateName in
<drivers-list selected:to="scope.vars.editing"/> <edit-plate plateName:bind="scope.vars.editing.licensePlate"/>
Click on one of the list items below and watch as its text appears in the input box. You can then edit the text and it will update in the list.
Exporting DOM properties
child-prop:to="key" can be used to export an attribute value into the scope. For example:
name in the scope when the
You can export a function to the parent references scope with a binding like:
And pass the method like:
<my-panel addPanel:from="scope.vars.addPanel" title:from="'CanJS'">CanJS Content</my-panel>
Check it out in this demo by clicking on the list items: