@ng4746/aside v0.0.2

Angular7 Aside

Install

npm i @ng4746/aside @angular/animations -S

app.module.ts

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AsideModule } from 'aside';

@NgModule({
  imports: [
    AsideModule,
    BrowserAnimationsModule
  ]
})

Add html:

<ng-aside #NgAside (cancel)="onCancel()"
           (submit)="onSave()"
           [title]="'Title'"
           [cancelButtonTitle]="'Discard'"
           [submitButtonTitle]="'Send'"
           [closeOnEscape]="false"
           [showOverlay]="false"
           [showDefaultFooter]="true"
           [showDefaultHeader]="true">
           
</ng-aside>

<button (click)="NgAside.show()">Show Sidebar</button>

You can disable default header and footer of panel

[showDefaultFooter]="false"
[showDefaultHeader]="false"

Add styles.scss:

@import "~@ng4746/aside/styles/simple";

MIT License