Result结果

用于反馈一系列操作任务的处理结果。

何时使用#

当有重要操作需告知用户处理结果，且反馈内容较为复杂时使用。

import { NzResultModule } from 'ng-zorro-antd/result';

代码演示

Successfully Purchased Cloud Server ECS!
Order number: 2017182818828182881 Cloud server configuration takes 1-5 minutes, please wait.
Success

成功的结果。

expand codeexpand code
      加载中
Your operation has been executed
Info

展示处理结果。

expand codeexpand code
      加载中
There are some problems with your operation
Warning

警告类型的结果。

expand codeexpand code
      加载中
403
Sorry, you are not authorized to access this page.
403

你没有此页面的访问权限。

expand codeexpand code
      加载中
404
Sorry, the page you visited does not exist.
404

此页面未找到。

expand codeexpand code
      加载中
500
Sorry, there is an error on server.
500

服务器发生了错误。

expand codeexpand code
      加载中
Submission Failed
Please check and modify the following information before resubmitting.

The content you submitted has the following error:

Your account has been frozen Thaw immediately >

Your account is not yet eligible to apply Apply immediately >

Error

复杂的错误反馈。

expand codeexpand code
      加载中
Great, we have done all the operators!
自定义 icon

自定义 icon。

expand codeexpand code
      加载中

API#

nz-result#

属性说明类型默认值
nzTitle标题TemplateRef<void>string
nzSubTitle副标题TemplateRef<void>string
nzStatus结果的状态，决定图标和颜色'success' | 'error' | 'info' | 'warning'| '404' | '403' | '500''info'
nzIcon自定义 iconTemplateRef<void>string
nzExtra操作区域TemplateRef<void>string

子元素#

你可以在 nz-result 中加入如下指令，它们的优先级低于上面的参数。

元素说明
i[nz-result-icon], div[nz-result-icon]在顶部展示的大图标
div[nz-result-title]标题
div[nz-result-subtitle]副标题
div[nz-result-content]内容，可以展示详细的信息
div[nz-result-extra]操作区域