General benefits of both actions & events ★ Uni-directional ★ No need to be aware of collaborators ★ Easy refactoring ★ “Loose coupling” 14 Thursday, September 19, 13
DOM Events in Ember 31 ■EventDispatcher sets up event delegation for many common DOM events and triggers events on the appropriate Ember View. ■Event names roughly match DOM event names. ■Views can optionally have an `eventManager` Thursday, September 19, 13
The More You Know™ 32 ■Events can be triggered with optional arguments, and listeners will receive them ■Ember.Evented#has lets you check to see if there are any listeners for an event name. Thursday, September 19, 13
Limitation: multiple action helpers 38 Not Supported Note: This should become possible in a future version of Ember via HTMLBars Thursday, September 19, 13
Controller targets ■ By default, the router is injected as `target` ■ Sometimes, Ember sets a controller’s `target` is set to another controller ■ {{render}} sets rendered controller to the template’s `controller` ■ {{each}} with an itemController, itemController instances `targets` are set to the parent 39 Thursday, September 19, 13
42 The Ember Router is a state machine ■ State machines are a proven way to reduce complexity in apps ■ External components send actions to a state machine without knowing what state it is in – the current state will handle it ■ Similar win as polymorphism – very decoupled Thursday, September 19, 13
43 The Ember Router is a state machine Template Router Current Route action action Template Router Product Route logout logout OrderConfirmation Route vs. Thursday, September 19, 13
44 The Ember Router is a hierarchical state machine ■ Hierarchical state machines allow better modeling of common event handling ■ Actions start at the current route and flow up to parent routes until a route handles it ■ The router provides a natural hierarchy Thursday, September 19, 13
46 The Ember Router is a hierarchical state machine ApplicationRoute ProductRoute OrderRoute ShippingRoute BillingRoute ConfirmationRoute Thursday, September 19, 13
47 The Ember Router is a hierarchical state machine ApplicationRoute ProductRoute OrderRoute ShippingRoute BillingRoute ConfirmationRoute ApplicationRoute OrderRoute BillingRoute Thursday, September 19, 13
47 The Ember Router is a hierarchical state machine ApplicationRoute ProductRoute OrderRoute ShippingRoute BillingRoute ConfirmationRoute Thursday, September 19, 13
The More You Know 48 ■ Return true from an action handler to keep the action bubbling ■ Power move: use a stateManager for an action target Thursday, September 19, 13
The More You Know 49 ■ Mixin Ember.TargetActionSupport to give an object the ability to trigger an action. (Use ViewTargetActionSupport for views.) ■ Mixin Ember.ActionHandler to give an object the ability to be a target. Thursday, September 19, 13
53 Follow me @lukemelia Luke and Yapp Labs are available for Ember.js-related consulting and training. Contact [email protected] Q & A Thursday, September 19, 13
lukemelia
hirokiotsuka
odasho
lmi
yururoi
tgalopin
bonjiri_niwa
iotengineer22
oogfranz
bitkey
wadayusuke
yusukeshimizu
kubukoz
reverentgeek
thoeni
paulrobertlloyd
nonsquared
bcantrill
jensimmons
hursman
skipperchong
mclloyd
brad_frost
samanthasiow
rmw