jsonschema - Json Schema Form Condition 根据枚举选定项显示/隐藏
问题描述
我有一个 Angular 项目,我在其中使用 JSON 模式表单 ( angular6-json-schema-form ) 在 JSON 模式中构建表单。
json 模式表单规范允许使用条件开关根据另一个表单元素的值选择性地显示/隐藏元素。文档中给出的唯一示例是简单的布尔值(如果 X 有值,则显示 Y)。
在我的示例中,当从选择列表中选择的文本输入类型是(文本、电子邮件、网址)之一但不显示(密码、颜色)时,我需要显示/隐藏“占位符”文本输入。请参阅下面的枚举数组,其中包含我需要测试的选项。
{
schema: {
type: 'object',
required: ['title'],
properties: {
type: {
title: 'Input Type',
description: 'Input type assists browser/phone UI behavior',
type: 'string',
enum: ['color', 'email', 'integer', 'number', 'password', 'tel', 'text']
},
placeholder: {
title: 'Placeholder',
description: 'The placeholder is shown inside the text element by default',
type: 'string'
}
},
layout: [
{ items: ['title', 'type'] },
{
key: 'placeholder',
condition: 'model.type.enum[selectedValue]!=="color"'
},
}
在上面的示例中,我唯一可以用来显示/隐藏占位符元素的方法如下:
{
key: 'placeholder',
condition: 'model.type'
}
Which simply shows the element when ANYTHING other than NONE is selected.
我试过了:
condition: 'model,type.modelValue !== "color"'
condition: 'type.modelValue !== "color"'
condition: 'model.type !== "color"'
并且这些都不会触发占位符元素的出现,无论在类型选择元素中选择了什么。
解决方案
这是我实施的解决我的问题的工作解决方案:
layout: [
{ items: ['title', 'type'] },
{
type: 'section',
condition: {
functionBody: 'try { return model.type && model.type!=="color" && model.type!=="password" } catch(e){ return false }'
},
items: ['placeholder']
},
...
]
推荐阅读
- python - 使用 tmux+vim 发送测试代码行的键绑定?
- yii2 - yii2基本和yii迁移错误中没有index.php文件
- python-2.7 - 我是编码新手,正在学习列表中的替换功能,我需要更深入的了解
- haskell - IO 是否应该在传播期间内联运行?
- reactjs - 如何从特定的表单控件中删除验证 css?
- ssl - gRPC 是否在 TLS 握手期间检查 CRL/OSCP 响应程序?
- opengl - nVidia GL 驱动程序状态:纹理 0 是基本级别不一致
- r - 如何在 str_replace_all 和 hunspell_suggest 上使用 lapply 来替换所有拼写错误的单词?
- java - 使用 System.nanoTime() 对不同长度的插入排序
- python - 带有叠加 PDF 的直方图