Angular简单的Alert组件– ngAlert

Angular简单的Alert组件– ngAlert
插件名称 ngAlert
发布时间 2020年6月22日
插件作者 theo4u

这是一个简单的警报组件,可帮助显示不同级别的警报(错误,警告,成功,信息)以及有关其行为方式的简单配置。

安装:

# NPM
$ npm install @theo4u/ng-alert --save

使用:

<ng-alert [(message)]="message" [dismissable]="true"></ng-alert>

message:是一个有界的两个属性IMessage

      export interface IMessage {
      type: MessageType,
      message: string,
      title?: string,
      buttons?: Array<{
        label: string,
        action?: Function,
        css?: string
      }>
      } 
  • type可以是MessageType.infoMessageType.successMessageType.errorMessageType.warning
  • dismissable:是一个可选字段,允许用户关闭或不关闭警报。 boolean。默认为
  • closeType:用于确定应在其上放置哪种关闭按钮,并且仅接受CloseType枚举。默认为CloseType.TIMES
    export enum CloseType {
    TIMES, NORMAL
    }

//使用
//关闭按钮在警告消息的下面
//关闭按钮在最右边x处
<ng-alert [(message)]="message" [dismissable]="true" [closeType]="closeTypes.NORMAL"></ng-alert>