FocusWithinDirective
directive
Directive keeping track of the focus beeing within a component. Once the component or any of its child components gain focus, a class of focusWithin will be set on the host component in order to allow styling it while beeing focused. Furthermore you can register callbacks once the component gets or looses focus.
Example :
// just set the css class
<some-component yuvFocusWithin></some-component>
// set the css class and listen to focus changes
<some-component (yuvFocusWithin)="onFocusEnter()" (yuvFocusWithinBlur)="onFocusLeave()"></some-component>Directive Metadata
Section titled “Directive Metadata”Selector: [yuvFocusWithin]
Standalone: Yes
Outputs
Section titled “Outputs”yuvFocusWithin
Section titled “yuvFocusWithin”Type: EventEmitter
Emitted once the component or any of its child components gains focus.
yuvFocusWithinBlur
Section titled “yuvFocusWithinBlur”Type: EventEmitter
Emitted once the component (incl. any of its child components) looses focus.
Properties
Section titled “Properties”hasFocusWithin
Section titled “hasFocusWithin”Type: unknown
Default Value: false
Methods
Section titled “Methods”onFocusIn
Section titled “onFocusIn”onFocusIn(evt: FocusEvent): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| evt | FocusEvent |
onFocusOut
Section titled “onFocusOut”onFocusOut(evt: FocusEvent): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| evt | FocusEvent |