ng2-simplert

0.0.7 • Public • Published

ng2-simplert

Angular 2 Simple Alert Component (SweetAlert Inspired) We use icon from SweetAlert

Ng2-Simplert

Demo

https://mazipan.github.io/ng2-simplert/

Download

npm install ng2-simplert --save
-- OR --
yarn add ng2-simplert

Or download latest release here : https://github.com/mazipan/ng2-simplert/releases

Module Declaration

....
import { SimplertComponent } from './simplert.component';
import { SimplertService } from './simplert.component.service';
...
@NgModule({
  declarations: [
    ...
    SimplertComponent
  ],
  imports: [
    ...
  ],
  providers: [
    SimplertService
  ]
})

See here : https://github.com/mazipan/ng2-simplert/blob/master/src/app/app.module.ts

Usage in component

....
import { SimplertService } from './simplert.component.service';
...
@Component({
  selector: 'app-root',
  template: `
    <button class="open--info" (click)="showPopup('Information!', 'Hey, I am Opened...')">Open Information Alert</button>
    <SimplertComponent [isUseRadius]="true"></SimplertComponent>
  `
})
export class AppComponent {
 
  constructor(private _simplertService: SimplertService){}
 
  showPopup(title: string, message: string){
    this._simplertService.openPopupBlock(title, message);
  }
}

See here : https://github.com/mazipan/ng2-simplert/blob/master/src/app/app.component.ts

Exposed Attribute

You can add this attribute below in :

Attribute Parameter Description
[isUseRadius] booleanParam: boolean true : will use radius, false : not use radius
[isUseIcon] booleanParam: boolean true : will use icon, false : not use icon

Exposed Method

You can access this below method from SimplertService :

Method Name Parameter Description
openPopupBlock title: string Title of alert (can be empty)
message: string Message of alert (can be HTML syntax)
openPopupBlockWithType title: string Title of alert (can be empty)
message: string Message of alert (can be HTML syntax)
type: string info (default), success, warning, error
changeShown booleanParam: boolean true : show, false : hide
setTitle title: string Title of alert (can be empty)
setMessage message: string Message of alert (can be HTML syntax)
setType type: string info (default), success, warning, error
setColorBtn btnColor: string string hex color (default: #068AC9)

License

MIT License

Hope will usefull for you all. Question ? please email : mazipanneh@gmail.com

Package Sidebar

Install

npm i ng2-simplert

Weekly Downloads

2

Version

0.0.7

License

MIT

Last publish

Collaborators

  • irfan.maulana