Uncaught Error: Can't resolve all parameters for ToastConfig


Topic: Uncaught Error: Can't resolve all parameters for ToastConfig:

vizmedia pro asked 7 years ago

in ngModule:
providers: [
      ....
      ToastrService,
      ToastConfig,
]
in Component:
...
constructor(public eventsService: EventsService, 
              private toastrService: ToastrService) {}
...
onShow() {
      const options: ToastConfig = { extendedTimeOut: 30000, messageClass: 'pink' };
      this.toastrService.info('Info message', 'Toastr info!', options);
}
I've got error:
compiler.es5.js:15997 Uncaught Error: Can't resolve all parameters for ToastConfig: (?). at syntaxError (compiler.es5.js:1690) [<root>] at CompileMetadataResolver._getDependenciesMetadata (compiler.es5.js:15766) [<root>] at CompileMetadataResolver._getTypeMetadata (compiler.es5.js:15634) [<root>] at CompileMetadataResolver._getInjectableMetadata (compiler.es5.js:15620) [<root>] at CompileMetadataResolver.getProviderMetadata (compiler.es5.js:15911) [<root>] at :4200/vendor.bundle.js:69184:49 [<root>] at Array.forEach (<anonymous>) [<root>] at CompileMetadataResolver._getProvidersMetadata (compiler.es5.js:15800) [<root>] at CompileMetadataResolver.getNgModuleMetadata (compiler.es5.js:15455) [<root>] at JitCompiler._loadModules (compiler.es5.js:26796) [<root>] at JitCompiler._compileModuleAndComponents (compiler.es5.js:26769) [<root>] at JitCompiler.compileModuleAsync (compiler.es5.js:26698) [<root>] at PlatformRef_._bootstrapModuleWithZone (core.es5.js:4535) [<root>] at PlatformRef_.bootstrapModule (core.es5.js:4521) [<root>]

Hello, You've to import ToastrServie and ToastConfig in your component where you want to use it. There is no need for providers. Working Example:

import { Component } from '@angular/core';
import { ToastrService } from './typescripts/pro/alerts/index';
import { ToastConfig } from './typescripts/pro/alerts/index';

@Component({
  selector: 'app-root',
  template: <code><a class=&quot;btn btn-success&quot; (click)=&quot;showSuccess()&quot; ripple-radius>Success message</a></code>
})

export class AppComponent {
  constructor(private toastrService: ToastrService) {}

  showSuccess() {
     this.toastrService.success('Info message');
  }
}
We're updating our docs so in close future they should be more precise.
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Open

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No