Question

我在我的角度组件中应用了toasterjs。这是我的代码。我使用代码导入了ToastrService：

import { ToastrService } from 'ngx-toastr';

并在构造函数中注入该服务

constructor(private toastrService: ToastrService) {    
}

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

但它出现以下错误：

无法解析ToastrService的所有参数：（？，[object Object]，[object Object]，[object Object]，[object Object]）

当我进入它的定义时，它需要4个参数。以下是参数：

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

我还添加了模块：

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

那么如何使用参数，因为我只想显示成功消息？

Answer 1

您已按照错误的顺序在应用的NgModule中导入了ToastrModule。它应按照documentation：

所示的顺序导入

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

如果此应用按照指示here在浏览器中运行，您还应将CommonModule替换为BrowserModule。

请注意，在调用success函数时，但在调用ToastrService的构造函数时不会发生错误。您的错误消息明确指出，并非所有ToastrService构造函数的参数都可以解析。其中一些参数无法解析，因为尚未创建这些参数的实例。要了解其工作原理，您应该阅读Angular框架中的documentation依赖注入。

Answer 2

要考虑的点： 我面临着同样的问题。所以这是我的解决方法

在安装'ngx-toastr'软件包并使用'toastr.css
应使用ng-serve命令重新运行Angular，因为应用程序不是通过更改angular.json文件呈现的。

Answer 3

尝试导入“注入”装饰器，然后在构造函数中装饰参数，并作为参数应添加ToastrService，如下所示：

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

无法解析ToastrService的所有参数：（？，[object Object]，[object Object]，[object Object]，[object Object]）

3 个答案: