在 Angular 7 中使用 bootstrap-notify

Question

我想在我的 Angular 7 应用程序中使用 bootstrap-notify。

为此，我安装了bootstrap-notify 包（以及@types/bootstrap-notify）。

在我想要使用通知的组件中，我像这样导入了 jQuery 服务：

import * as $ from 'jquery';

现在称为notify，如文档中所述here：

$.notify({
    // options
    message: 'Hello World' 
},{
    // settings
    type: 'danger'
});

问题是我得到了这个错误：

ERROR in src/app/home/home.component.ts(28,7): error TS2339: Property 'notify' does not exist on type 'JQueryStatic'.

知道如何让它工作吗？我找不到任何使用此包的 Angular (5/6/7) 示例！

Answer 1

您可以尝试以下方法。

1) jquery的第一个安装类型定义：

npm install @types/jquery

2) 然后在组件文件中，导入jquery并通知使用。

import * as $ from 'jquery';
import 'bootstrap-notify';

$[`notify`](....);

3) 最后，您还需要添加 css 文件/链接以查看其实际样式。

演示https://stackblitz.com/edit/angular-custom-alert-message-hqrysq?file=app%2Fapp.component.ts

有时它会抛出错误，但如果您在代码中添加一些空格并保存它，它会正常运行。