-
Notifications
You must be signed in to change notification settings - Fork 362
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Tostr messages not working. Script error in browser console. #137
Comments
Can you show us the ng module where you're importing toastrmodule |
Also a bit more on where you're using toastr service? In a component or service? |
Hi @scttcper , Thanks for the reply. My scenario is that I want to show a toastr error message when some exception occur in the application. PFB the code I wrote: ` import { ErrorHandler, Injectable, Injector} from '@angular/core'; @Injectable()
} //toastr.service.ts import {Injectable} from '@angular/core'; @Injectable()
}` Hope this helps. |
I've implemented something like this before. Here is what I've done: app.error-handler.ts: import { ErrorHandler, Inject, Injector, NgZone, isDevMode } from "@angular/core";
import { Response } from "@angular/http";
import { ToastrService } from "ngx-toastr";
import * as Raven from 'raven-js'
export class AppErrorHandler implements ErrorHandler {
constructor(@Inject(NgZone) private ngZone: NgZone, @Inject(Injector) private injector: Injector) { }
private get toastr(): ToastrService {
return this.injector.get(ToastrService);
}
public handleError(error: any): void {
this.ngZone.run(() => {
let errorTitle = 'Error';
let errMsg = 'An unexpected error ocurred';
if (error instanceof Response) {
const contentType = error.headers.get("Content-Type")
if (contentType && contentType == "application/json") {
const body = error.json();
errorTitle = body.message || errorTitle;
errMsg = body.detailedMessage || JSON.stringify(body);
} else {
errMsg = error.text();
}
}
this.toastr.error(errMsg, errorTitle);
});
if (!isDevMode())
Raven.captureException(error.originalError || error);
else
throw error;
}
} And then in app.module.ts: @NgModule({
// ... other imports, declarations, etc.
providers: [
{ provide: ErrorHandler, useClass: AppErrorHandler },
// ... other providers
]
})
export class AppModule {} This is very similar to what you're doing. I'm not sure if NgZone is needed or not, it was working for HTTP error without it, but I decided to add it anyways, just in case. |
Hi @yarrgh , I emulated your code snippet and it worked like a charm. Thanks, |
Glad it worked for you! |
@yarrgh the dependency injection wizard. I'll have to setup sentry in my app that way. |
@yarrgh wow... thank you so much, i was losing hope. |
i got the different error, so something is fishy, please owner look at this sir?app.global.errorhandler.ts:20 Error: Uncaught (in promise): TypeError: Cannot read property 'create' of undefined |
Hi,
I followed the instructions to setup toastr as per the readme. Am using Angular version 4.1.3.
ngx-toastr version is 5.2.4
this.toastrService.success('Hello world!', 'Toastr fun!');
The above line is throwing the following exception in browser console:
dom-portal-host.js:45 Uncaught TypeError: Cannot read property 'attachView' of undefined at DomPortalHost.attachComponentPortal (dom-portal-host.js:45) at DomPortalHost.BasePortalHost.attach (portal.js:47) at OverlayRef.attach (overlay-ref.js:10) at ToastrService._buildNotification (toastr-service.js:152) at ToastrService.success (toastr-service.js:25)
Any help is greatly appreciated.
Thanks,
Hari
The text was updated successfully, but these errors were encountered: