Criei este componente para mostrar mensagem de sucesso ou não.
import { Component } from ‘@angular/core’;
import { MatSnackBar } from ‘@angular/material’;
@Component({
selector: 'app-snack-bar',
templateUrl: './snack-bar.component.html',
styleUrls: ['./snack-bar.component.css']
})
export class SnackBarComponent {
snackBar: MatSnackBar
constructor(
) {}
openSnackBar(message: string, isOnline : boolean) {
this.snackBar.open(message, undefined,
{ duration: 3000,
panelClass: isOnline ? ["online", "onlineAction"] : "offline" }
);
}
}
Para chamar estou fazendo assim:
onSubmit(form){
const snackBarComponent = SnackBarComponent;
snackBarComponent.prototype.openSnackBar(dados.mensagem, true);
}
Só que apresenta este erro no console do navegador:
ERROR TypeError: Cannot read property 'open' of undefined at Object.SnackBarComponent.openSnackBar (snack-bar.component.ts:18) at MunicipioFormComponent.onSubmit (municipio-form.component.ts:115) at Object.eval [as handleEvent] (MunicipioFormComponent.html:1) at handleEvent (core.js:13547) at callWithDebugContext (core.js:15056) at Object.debugHandleEvent [as handleEvent] (core.js:14643) at dispatchEvent (core.js:9962) at eval (core.js:12301) at SafeSubscriber.schedulerFn [as _next] (core.js:4343) at SafeSubscriber.__tryOrUnsub (Subscriber.js:243) View_MunicipioFormComponent_0 @ MunicipioFormComponent.html:1 proxyClass @ compiler.js:14653 DebugContext_.logError @ core.js:14996 ErrorHandler.handleError @ core.js:1509 dispatchEvent @ core.js:9966 (anonymous) @ core.js:12301 schedulerFn @ core.js:4343 SafeSubscriber.__tryOrUnsub @ Subscriber.js:243 SafeSubscriber.next @ Subscriber.js:190 Subscriber._next @ Subscriber.js:131 Subscriber.next @ Subscriber.js:95 Subject.next @ Subject.js:56 EventEmitter.emit @ core.js:4311 NgForm.onSubmit @ forms.js:5762 (anonymous) @ MunicipioFormComponent.html:1 handleEvent @ core.js:13547 callWithDebugContext @ core.js:15056 debugHandleEvent @ core.js:14643 dispatchEvent @ core.js:9962 (anonymous) @ core.js:10587 (anonymous) @ platform-browser.js:2628 ZoneDelegate.invokeTask @ zone.js:421 onInvokeTask @ core.js:4740 ZoneDelegate.invokeTask @ zone.js:420 Zone.runTask @ zone.js:188 ZoneTask.invokeTask @ zone.js:496 invokeTask @ zone.js:1517 globalZoneAwareCallback @ zone.js:1543 MunicipioFormComponent.html:1 ERROR CONTEXT DebugContext_ {view: {…}, nodeIndex: 0, nodeDef: {…}, elDef: {…}, elView: {…}}
O que pode ser ?
