akserg / ng2-toasty

Angular2 Toasty component shows growl-style alerts and messages for your app.
MIT License
283 stars 102 forks source link

Style does not work in ErrorHandler #91

Open levinhtxbt opened 7 years ago

levinhtxbt commented 7 years ago

Hi. I have a problem when i try to implement ng2-toasty in a class that implements from ErroHandler. The toasts appeared but without any styles. I have added 'ng2-toasty', 'ng2-toasty/bundles/style-bootstrap.css', in webpack.config.vendor.js. If I call in component, everything is ok.

This is CustomErrorHandler:

import { Injectable } from '@angular/core';
import { ToastyService } from 'ng2-toasty';
import { ErrorHandler, NgZone } from "@angular/core";

@Injectable()
export class CustomErrorHandler implements ErrorHandler {

    constructor(
        private ngZone: NgZone,
        private toastyService : ToastyService) {}

    handleError(error : any) : void {
        console.log(error);
        this.ngZone.run(() => {         
            if (typeof(window) !== 'undefined') {
                this
                    .toastyService
                    .error({
                        title: 'Error', 
                        msg: 'An unexpected error happened', 
                        theme: ' bootstrap', 
                        showClose: true, 
                        timeout: 5000
                    });
            }

        });

    }
}

This is "app.module"

import { ErrorHandler } from '@angular/core';
import { CustomErrorHandler } from './services/app.error-handle';
....
import { ToastyModule} from 'ng2-toasty';
....

@NgModule({
    declarations: [
        AppComponent,
        NavMenuComponent,
        CounterComponent,
        FetchDataComponent,
        HomeComponent,
        VehicleFormComponent
    ],
    imports: [
        CommonModule,
        ToastyModule.forRoot(),
        HttpModule,
        FormsModule,
        RouterModule.forRoot([
           ...
        ])
    ],
    providers: [
        { provide: ErrorHandler, useClass: CustomErrorHandler },
        VehicleService
    ]
})
export class AppModuleShared {
}

Screenshot:

Image

Could you give me a way to fix. Thanks

VlSuslov commented 7 years ago

Try to run 'webpack --config webpack.config.vendor.js' in command line. If you are working with ASP NET Core it doesn`t run webpack with this config automatically.

levinhtxbt commented 7 years ago

I tried but not working

erickpazzim commented 6 years ago

Try to add @import '~ng2-toasty/bundles/style-bootstrap.css'; in your styles.css

satishkayada commented 5 years ago

I have the same problem. stuck for a long time. Webpack is not command supported. I have followed Mosh Madani tutorial for learning from udamy.