feat(IgxToast): allow to pass a string param on show method #7156

projects/igniteui-angular/src/lib/toast/toast.component.html

@@ -1,3 +1,3 @@
 <ng-content></ng-content>
-<span>{{ message }}</span>
+<span>{{ toastMessage }}</span>
 

projects/igniteui-angular/src/lib/toast/toast.component.ts

@@ -1,5 +1,6 @@
 import { animate, state, style, transition, trigger } from '@angular/animations';
 import { CommonModule } from '@angular/common';
+import { DeprecateProperty } from '../core/deprecateDecorators';
 import {
     Component,
     ElementRef,
@@ -205,10 +206,26 @@ export class IgxToastComponent implements IToggleView, OnInit, OnDestroy {
     public isVisibleChange = new EventEmitter<boolean>();
 
     /**
-     * @hidden
+     * @deprecated Place your message in the toast content instead.
+     * Sets/gets the message that will be shown by the toast.
+     * ```html
+     * <igx-toast [message] = "Notification"></igx-toast>
+     * ```
+     * ```typescript
+     * let toastMessage = this.toast.message;
+     * ```
+     * @memberof IgxToastComponent
      */
+    @DeprecateProperty(`'message' property is deprecated.
+    You can use place the message in the toast content or pass it as parameter to the show method instead.`)
     @Input()
-    public message = '';
+    public set message(value: string) {
+        this.toastMessage = value;
+    }
+
+    public get message() {
+        return this.toastMessage;
+    }
 
     /**
      * Sets/gets the position of the toast.
@@ -235,6 +252,12 @@ export class IgxToastComponent implements IToggleView, OnInit, OnDestroy {
         return this.elementRef.nativeElement;
     }
 
+    /**
+     * @hidden
+     * @internal
+     */
+    toastMessage = '';
+
     /**
      * @hidden
      */
@@ -252,8 +275,9 @@ export class IgxToastComponent implements IToggleView, OnInit, OnDestroy {
      * ```
      * @memberof IgxToastComponent
      */
-    public show(): void {
+    public show(message?: string): void {
         clearInterval(this.timeoutId);
+        if (message !== undefined) { this.toastMessage = message; }
         this.onShowing.emit(this);
         this.isVisible = true;
         this.animationState = 'visible';