$.notify 不是 Angular 函数 - Javascript

在使用 Angular 框架的过程中，有些开发者可能会遇到类似于“$.notify 不是 Angular 函数”的错误提示。这是因为 $.notify 是一个专门针对 jQuery 的函数，而不是 Angular 框架内置的函数。

什么是 $.notify?

$.notify 是一个 jQuery 插件，用于展示提示信息或通知。它可以自定义样式、位置、内容、延迟时间等等，非常灵活方便。

如何使用 $.notify?

首先需要在 HTML 中引入 jQuery 和 $.notify 的相关文件，然后在 Javascript 中调用 $.notify() 函数即可。下面是一个简单的示例：

$.notify("Hello World!");

这个示例会在页面中展示一个默认样式的提示信息“Hello World!”。

Angular 应该怎么做？

虽然在 Angular 中不能直接使用 $.notify，但我们可以通过 Angular 自带的库来实现相同的效果。比如使用 Angular Material 中的 MatSnackBar 组件。下面是一个示例：

<button (click)="openSnackBar()">打开提示</button>

import { Component } from '@angular/core';
import { MatSnackBar } from '@angular/material/snack-bar';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor(private _snackBar: MatSnackBar) {}

  openSnackBar() {
    this._snackBar.open('Hello World!', '关闭', {
      duration: 2000,
    });
  }
}

这个示例会在页面中展示一个按钮，当用户点击按钮时，会自动弹出一个提示信息“Hello World!”，并且自带关闭按钮，2秒钟后自动消失。

总结

虽然 $.notify 不是 Angular 函数，但我们可以通过 Angular 自带的库来实现相似的效果。对于需要展示提示信息或通知的场景，我们可以使用 MatSnackBar 组件来代替。