无法解析 ToastrService 的所有参数：(?, [object Object], [object Object], [object Object], [object Object])

Question

I am applying toasterjs in my angular component. Here is my code. i have imported the ToastrService using the code:

import { ToastrService } from 'ngx-toastr';

and inject that service in the constructor

constructor(private toastrService: ToastrService) {    
}

this.toastrService.success('You are awesome!', 'Success!',)

But it is giving the following error:

Can't resolve all parameters for ToastrService: (?, [object Object], [object Object], [object Object], [object Object])

When I go to its definition, then it is taking 4 parameters. Here are the parameters:

success(message?: string, title?: string, override?: Partial<IndividualConfig>): ActiveToast;

I have added the module also:

imports: [
    ToastrModule.forRoot(),
    CommonModule,
    HttpModule,
    FormsModule,
    ReactiveFormsModule,
    TextboxModuleShared,
    DateTimeModuleShared,
    DropdownModuleShared
],

So how can I use the parameters because I want to only show success message?

Answer 1

You have imported the ToastrModule in your app's NgModule in the incorrect order. It should be imported in the order as indicated by the documentation :

@NgModule({
  imports: [
    CommonModule,
    BrowserAnimationsModule, // required animations module
    ToastrModule.forRoot(), // ToastrModule added
  ],
  bootstrap: [App],
  declarations: [App],
})
class MainModule {}

You should also replace CommonModule with BrowserModule if this app is running in the browser as indicated here .

Note that the error doesn't occur while calling the success function, but while invoking the constructor of the ToastrService . Your error message clearly states that not all parameters for the ToastrService constructor can be resolved. Some of these parameters cannot be resolved, because no instances for those parameters have been created yet. To understand how this works, you should read the documentation on dependency injection within the Angular framework.

Answer 2

Point to Consider : I was facing same issue. So here how I get solution

• After installing 'ngx-toastr' Package and updating angular.json file with 'toastr.css

• angular should be re-run by using ng-serve command, because app is not rendered by changing angular.json file

Answer 3

尝试导入 'Inject' 装饰器，然后在构造函数中装饰参数，作为参数，您应该像这样添加 ToastrService：

constructor(@Inject(ToastrService) private toastyService: ToastrService ) { }