usage.md

Notify | Usage

• Component (ql-notify)
• Directive ()
• Service (NotifyService)

app.module.ts

import {NotifyModule} from '@qrsln/loot-box/Libs/Notify';

@NgModule({
  imports: [NotifyModule, /*...*/],
})

Usage

Layout Component

<!--Layouts Component-->
<ql-notify></ql-notify>
<main>
  <router-outlet></router-outlet>
</main>

// constructor( private notifyService: NotifyService ) {}

Show()
{
  const notifyItem = {
    Theme: NotifyTheme.None, IconSize: NotifyIconSize.Large, Anim: NotifyAnim.Grow,
    Message: '', Title: '', ExpireIn: 4000,
    Icon: true, Countdown: true, Dismissible: true,
    ProgressBar: true, Titled: false, Outlined: false, Gradient: false,
  } as NotifyItem;
  
  // Show ==> Customize Notifications
  this.notifyService.Show(+this.Style, notifyItem, +this.Position);
}


Defaults()
{
  this.notifyService.None('My None message', 5000, NotifyPosition.TopCenter);
  this.notifyService.Success('My Success message', 4000, NotifyPosition.TopCenter);
  this.notifyService.Error('My Error message', 5000, NotifyPosition.TopCenter);
  this.notifyService.Info('My Info message', 8000, NotifyPosition.TopCenter);
  this.notifyService.Warning('My Warning message', 5000, NotifyPosition.TopCenter);
}