Angularity

Core
Overview Exceptions Type Container Type-safe Providing
CDK
Overview Breakpoints
API References
cdk / layout / Class

NamedBreakpointObserver

Decorators:@Injectable

Higher level abstraction of BreakpointObserver from Angular CDK, allowing observing multiple named breakpoints.

Properties

NameTypeDescription
observer
p
BreakpointObserver

Methods

observe()

Observes the given breakpoints and returns an observable map of their states.

Notes

The return type carries type information about the breakpoint names, allowing for type-safe access to the breakpoint states.

Presentation
observe(config: BreakpointConfig<BreakpointName>): Observable<BreakpointMap<BreakpointName>>;
Parameters
NameTypeDescription
config
BreakpointConfig<BreakpointName>

a map of breakpoint names and their corresponding queries

Returns
Observable<BreakpointMap<BreakpointName>> -

an Observable emitting the current state of each of the configured breakpoints.

Example usage
observer.observe({
  small: '(max-width: 599px)',
  medium: '(min-width: 600px) and (max-width: 959px)',
  large: '(min-width: 960px)',
}).subscribe((state) => {
  state.small;
  state.medium;
  state.large;
})
protected

parseState()

No documentation has been provided.

Presentation
protected parseState(config: BreakpointConfig<BreakpointName>, state: BreakpointState): BreakpointMap<BreakpointName>;
Parameters
NameTypeDescription
config
BreakpointConfig<BreakpointName>
state
BreakpointState
Returns
BreakpointMap<BreakpointName>