exception 异常

异常页用于对页面特定的异常状态进行反馈。通常,它包含对错误状态的阐述,并向用户提供建议或操作,避免用户感到迷失和困惑。

  1. import { ExceptionModule } from '@delon/abc/exception';

代码演示

exception 异常 - 图1

404 页面。

  1. import { Component } from '@angular/core';
  2. @Component({
  3. selector: 'components-exception-404',
  4. template: `
  5. <exception type="404"></exception>`
  6. })
  7. export class ComponentsException404Component {
  8. }

exception 异常 - 图2

500 页面。

  1. import { Component } from '@angular/core';
  2. @Component({
  3. selector: 'components-exception-500',
  4. template: `
  5. <exception type="500"></exception>`
  6. })
  7. export class ComponentsException500Component {
  8. }

exception 异常 - 图3

403 页面,配合自定义操作。

  1. import { Component } from '@angular/core';
  2. @Component({
  3. selector: 'components-exception-403',
  4. template: `
  5. <exception type="403">
  6. <button nz-button [nzType]="'primary'">回到首页</button>
  7. <button nz-button>查看详情</button>
  8. </exception>`
  9. })
  10. export class ComponentsException403Component {
  11. }

API

exception

成员说明类型默认值
[type]页面类型,若配置,则自带对应类型默认的 titledescimg,此默认设置可以被 titledescimg 覆盖‘403’,’404’,’500’-
[title]标题string-
[desc]补充描述string-
[img]背景图片地址string-
ng-content建议操作,配置此属性时默认的『返回首页』按钮不生效TemplateRef<void>-