RZ Layout

Example

<rz-layout menuPosition="right">

 <rz-layout-header>

  <rz-layout-header-title>

   Page title

  </rz-layout-header-title>

  <rz-layout-header-side-container>

   Something next to the title

  </rz-layout-header-side-container>

 </rz-layout-header>

 <rz-layout-menu>

  <rz-layout-menu-item *ngFor="let menuItem of menuItems" [routerLink]="menuItem.link">

   {{menuItem.label}}

  </rz-layout-menu-item>

  <rz-layout-menu-footer>

   Label at the menu bottom

  </rz-layout-menu-footer>

 </rz-layout-menu>

 <rz-layout-content>

  The page main content

 </rz-layout-content>

</rz-layout>

Parameters

menuPosition: 'right' | 'left' (default)

RZLayout Service

To change title or side container, use the header service methods:

RZLayoutService.changeHeaderTitle(title: string): void;

RZLayoutService.changeHeaderSideContainer(content: TemplateRef<unknown> | ComponentFactory<unknown> | null): void;

* Implements 'OnPush' Change Detection Strategy