@ravindracode/rgx-toast v0.0.20

Note : Comming Soon, Thanks. :+1:

Features

This library for all type of message like toast type messages And this is really so easy to implement in Angular.

Dependencies

Latest version would be for each version of Angular

RgxMat-message Angular current >= 9.x

Getting started

with npm : npm i @ravindracode/rgx-toast --save

How to use

After installation you have to import this ToastModule in your module like : import { ToastModule } from '@ravindracode/rgx-toast';

In your Module

Example :

    import { BrowserModule } from '@angular/platform-browser';
    import { NgModule } from '@angular/core';

    import { AppRoutingModule } from './app-routing.module';
    import { AppComponent } from './app.component';
    import { ToastModule } from '@ravindracode/rgx-toast'; // required module
    import { ToastService } from '@ravindracode/rgx-toast'; // required service 

    @NgModule({
      declarations: [AppComponent],
      imports: [
        BrowserModule, // required BrowserModule module
        AppRoutingModule,
        ToastModule // ˇToastModule added
        ],
      providers: [ToastService], // ToastService added
      bootstrap: [AppComponent]
    })
    export class AppModule {}`

Add directive in component .html file

Container directive : <RgxMat-message></RgxMat-message>.

In your component .ts file

Example :

    import { Component } from '@angular/core';
    import { ToastService } from '@ravindracode/rgx-toast'; // import from the library

    @Component({
      selector: 'app-root',
      templateUrl: './app.component.html',
      styleUrls: ['./app.component.css']
    })

    export class AppComponent {

      constructor(public toastService: ToastService) {} // inject here

      createBlaBla() {
        this.toastService.show({
          label: 'error', // here is pass label like: success | error | warning | info.
          timeout: 5000, // here is pass toast life in mili second.
          position: 'right-top', //here is pass position like: left-top | left-bottom | right-top | right-bottom.
          message: 'Contract has been created!' // here is pass your message.
        });
      }

    }

Properties

Events

Contact

You can direct connect with me if any query - Linkedin : https://www.linkedin.com/in/ravindra-gupta-652768123/