@ravindracode/message
v0.0.28
Published
> > Note : Please send me feedback via below link of linkedin, Thanks. :+1:
Downloads
13
Readme
Note : Please send me feedback via below link of linkedin, 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/message --save
How to use
After installation you have to import this MessageModule
in your module like : import { MessageModule } from '@ravindracode/message';
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 { MessageModule } from '@ravindracode/message'; // required module
import { MessageService } from '@ravindracode/message'; // required service
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule, // required BrowserModule module
AppRoutingModule,
MessageModule // MessageModule added
],
providers: [MessageService], // MessageService 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 { MessageService } from '@ravindracode/message'; // import from the library
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
constructor(public messageService: MessageService) {} // inject here
createBlaBla() {
this.messageService.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
| Parameters | Type | Default | Info | | --------- | :-----: | :-------: | :---------- | | label | string | success | There is four type of label - success & warning & info & error | | timeout | number | null | You can pass number in milisecond for toast life | | position | string | right-top | There is four type of position - left-top & left-bottom & right-top & right-bottom | | message | string | Dummy text | You can set your own messages in field. |
Events
| Name | Parameters | Description | | ------ | :--------------------: | :---------------------------------- | | onHide | event: Animation event | Callback to invoke when toast hide. |
Contact
You can direct connect with me if any query - Linkedin : https://www.linkedin.com/in/ravindra-gupta-652768123/