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>]

Add comment

Adrian Sawicki answered 7 years ago

0 0 Best answer

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.

Add comment

Write

Create snippet

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

About author

vizmedia

Pro User

94Support score
9Questions 15Answers

0Snippets likes 0Snippets