mdcFocusTrap directive makes it possible to trap focus inside
a subtree of the DOM. An activated focus trap prevents users from interacting
with elements outside the trapped area. This can be used to create an accessible
experience for modal dialogs. Therefore
mdcFocusTrap is typically
used in combination with
Focus Trap Demo
When placed on a child element of an
mdcFocusTrap, the focus trap
will try to move focus to this element when the focus trap is activated.
Directive for trapping focus (by key and/or mouse input) inside an element. To be used
for e.g. modal dialogs, where focus must be constrained for an accesssible experience.
mdcFocusInitial on a child element if a specific element needs to get
focus upon activation of the trap. In the absense of an
or when that element can't be focused, the focus trap will activate the first tabbable
child element of the focus trap.
Set this property to have clicks outside the focus area untrap the focus. The value is taken when the trap is activated. Thus changing the value while a focus trap is active does not affect the behavior of that focus trap.
Set this property to ignore the escape key. The default is to deactivate the trap when a user presses the escape key. The value is taken when the trap is activated. Thus changing the value while a focus trap is active does not affect the behavior of that focus trap.