ParentVM to ChildVM Attr / DOM Attr¹
attribute="{ vmKey }"
attribute="{{ vmKey }}"
ParentVM to ChildVM Attr / DOM Attr¹
attribute="{ ^vmKey }"
ChildVM Attr to Parent VM¹
attribute="{ *vmKey }"
one-way bound ChildVM to template scope
(click)="{ doSomething() }"
When event is triggered on childVM or DOM Element¹ the call expression is called on parentVM or template scope
1: ChildVM Attr / DOM Attr: it will attempt to bind to an attribute on the VM, but if
that VM does not have that value, or have it defined (key in vm
), it will bind to the
DOM attribute. Similarly, event bindings will look for the attribute on the VM
and if not found will bind to the DOM element events
Prefixing an attribute with $
will make it ignore the view model for events and bindings
and only use the DOM elements events / attributes.
This will ONLY be necessary if there is a name clash between the view model and the DOM though, as all the other methods will bind to the DOM if the view model does not have a matching attribute/event
$attribute="{ vmKey }"
ParentVM to DO Element Attr (ignore VM)
$attribute="{ vmKey }" // one-way bound
Parent VM Attr to DOM Element Attr (ignore VM)
$attribute="{ ^vmKey }"
one-way bound DOM Element Attr to Parent VM (ignore VM)
($click)="{ doSomething() }"
DOM event call expression on parentVM or template scope (ignore VM)