ng-后台管理之其他文档

**<sf mode=“edit” [schema]=“schema” [ui]=“ui” [formData]=“i” button=“none”>

这里是引用
<sf mode=“edit” [schema]=“schema” [ui]=“ui” [formData]=“i” button=“none”>

**
校验错误
写在前面#
JSON Schema 校验过程中会生产一组错误信息，每一个错误都有一个固定的 keyword 来表示，允许通过 DelonFormConfig.errors 来覆盖默认的错误信息，包括处理错误信息国际化问题。例如当某属性为必填性时产生的错误信息为:

[{
“keyword”: “required”,
“dataPath”: “.client”,
“schemaPath”: “#/required”,
“params”: {“missingProperty”:“client”},
“message”:“必填项”
}]
其中 message 用于页面渲染的错误文本。

注：第一次渲染会触发校验，但不会有任何视觉展示，若需要一开始就体现错误视觉效果可以指定。

自定义错误文本#
分别支持 DelonFormConfig.errors（一般用于国际化）或 ui.errors（针对某个属性）结构来处理错误文本。

DelonFormConfig

在根模块重新注入 DelonFormConfig 实例：

import { DelonFormConfig } from ‘@delon/abc’;
export function fnDelonFormConfig(): DelonFormConfig {
return Object.assign(new DelonFormConfig(), {
errors: {
‘required’: ‘必填项’,
// others
}
});
}

@NgModule({ })
export class DelonModule {
static forRoot(): ModuleWithProviders {
return {
ngModule: DelonModule,
providers: [
{ provide: DelonFormConfig, useFactory: fnDelonFormConfig }
]
};
}
}
ui.errors

schema: SFSchema = {
properties: {
email: {
type: ‘string’,
title: ‘邮箱’,
format: ‘email’,
maxLength: 20,
ui: {
errors: {
‘required’: ‘必填项’
}
}
}
}
};
keyword#
不管采用哪种方式来构建错误文本，都必须通过 keyword 来区分错误类型（完整类型见 ERRORSDEFAULT）。

自定义校验#
JSON Schema 校验并不一定能够满足一些业务的需求，例如需要根据其他属性值区分不同校验规则：

属性校验#
schema: SFSchema = {
properties: {
name: {
type: ‘string’
},
email: {
type: ‘string’,
title: ‘邮箱’,
format: ‘email’,
ui: {
validator: (value: any, formProperty: FormProperty, form: PropertyGroup) => {
return form.value.name === ‘cipchk’ ? [] : [{ keyword: ‘required’, message: ‘必须是cipchk@qq.com’}];
}
}
}
}
};
异步校验#
例如一个异步校验用户名是否存在示例：

schema: SFSchema = {
properties: {
name: {
type: ‘string’,
ui: {
validator: (value: any) => this.http.get(/user/check/${value}).pipe(
map(res => res ? [ { keyword: ‘required’, message: ‘用户名已存在’} ] : [])
)
}
}
}
};
注意：由于每一次校验都是重新实例一次，因此无法做一些控制的操作，例如：去抖 debounceTime。

视觉#
可以通过设置 DelonFormConfig.onlyVisual 或 ui.onlyVisual 属性控制只展示错误视觉不显示错误文本。

Debug#
JSON Schema 对格式有严格的要求，例如日期格式必须遵守 RFC3339 时间格式：

{
properties: {
time: {
type: ‘string’,
ui: { widget: ‘date’, mode: ‘range’ },
title: ‘Date’,
format: ‘YYYY-MM-DD HH:mm:ss’
}
},
ui: {
debug: true
}
}
其中 format 是一个错误时间格式，当指定 debug: true 时，会在控制台接收到详细的校验错误描述：

Error: unknown format “YYYY-MM-DD HH:mm:ss” is used in schema at path “#/properties/time”

ng-后台管理之其他文档相关推荐

智慧社区综合管理平台——需求文档（第九组）
目录 1.引言 1.1 项目简介 1.2 目的 1.3 文档的范围 1.4 预期的读者和阅读建议 1.5 产品的范围 1.6 参考文献 2.总体描述 2.1 产品视角 2.2 用户特征 2.3 系统 ...
案例 | 巴别鸟助推WE+管理入驻企业文档资料
巴别鸟的标签功能非常契合我们的工作需求,是我们管理入驻企业文档资料.实现精准匹配的得力助手.巴别鸟的基础功能体验也不错.客户服务到位,响应速度很快. -- WE+ 上海金钟社区客户简介 WE+ 是一 ...
文秀才文档管理系统文档管理,CAD, 图纸管理, 百度文库, 文档在线预览
原文来自 http://www.fanganwang.com/Product-detail-item-1440.html,欢迎转载. 关键字:文档管理,CAD, 图纸管理, 百度文库, 文档在线预览 ...
魔坊APP项目-11-PyMongo、数据库连接，管理、集合管理、文档管理（添加文档、查询文档、删除文档、更新文档）
PyMongo 安装: pip install pymongo 一.数据库连接数据库连接,无密码 from pymongo import MongoClient# 数据库链接,必须保证当前系统能正常 ...
教育平台项目后台管理系统：接口文档
课程管理模块接口文档课程信息模块接口接口 1:查询课程列表信息名称: findCourseList 描述: 查询课程列表信息 URL: http://localhost:8080/lagou_e ...
物流公司管理列表html文档,物流后台管理系统+html网站
[实例简介] 一个物流的后台管理HTML整合. 更好,更方便修改的整合. [实例截图] [核心代码] 物流后台管理系统html网站 └── 物流后台管理系统 ├── AreaManagement │ ...
Yapi 可视化接口管理平台部署文档
一[yabi介绍] 1.1 官网 github:https://github.com/ymfe/yapi Yapi 可视化接口管理平台 Yapi 是高效.易用.功能强大的 api 管理平台,旨在为开发 ...
社区智能管理平台需求文档【第八周】
//本文档为北京理工大学21级软件需求工程课程11组的项目需求文档目录 a.引言 a.1目的 a.2文档约定 a.3预期的读者和阅读建议 a.4产品的范围 a.5参考文献 b.综合描述 b.1产品的 ...
Office SharePoint Server 2007 (Beta2) 管理、部署文档
由于微软已经开放了2007 Office System Beta2的免费下载,相信不少SharePoint爱好者已经拿到了Beta2的安装文件.如果你希望有一份详细的SharePoint 2007部署 ...
python web 文件管理_我的第一个python web开发框架（23）——代码版本控制管理与接口文档...
书接上一回,小白和老菜聊到代码的版本控制和接口文档小白:为什么要做版本控制,我不弄版本控制不也完成了项目了吗?要做版本控制不是很麻烦,又要安装服务又要提交代码,代码又不是多人用开发,还要写文档... ...

ng-后台管理之其他文档

ng-后台管理之其他文档相关推荐

最新文章

热门文章