An Angular NGX Library For Creating Beautiful Dynamic Panels

Angular Panel Library (ngx panels) is an Angular library for creating beautiful dynamic panels.

angularmaterial sidenav menu example, angular material sidenav right side, mat drawer close on outside click, angular sidebar menu with submenu example

A Library That Helps You Write a Static Dropdown Menu | JSPanel

How to make use of it:

Installations:

npm install @verizon/ngx-panels

1. Import PanelModule.forRoot() in the module hosting the panel container.

@NgModule({
    declarations: [AppComponent, SampleComponent],
    imports: [BrowserModule, BrowserAnimationsModule, PanelModule.forRoot()],
    providers: [],
    entryComponents: [SampleComponent],
    bootstrap: [AppComponent]
})
export class AppModule {}

2. In HTML, just use the ngx-panel-container element. This will be the stand for all the panels.

<!-- your app -->
<ngx-panel-container></ngx-panel-container>

3. You should place this container inside an HTML element that has some space.

// ...
export class AppComponent {
    constructor(private readonly panelService: PanelService) { }

    yourFunction() {
        this.panelService.open(SampleComponent);
    }
}

Angular Panel Library (ngx-panels) Plugin/Github, mat drawer container example

See Demo And Download

Official Website(verizonconnect): Click Here

This superior jQuery/javascript plugin is developed by verizonconnect. For extra Advanced Usages, please go to the official website.