Условие формы схемы Json показать / скрыть на основе выбранного элемента перечисления - PullRequest
Новая
       24

Условие формы схемы Json показать / скрыть на основе выбранного элемента перечисления

0 голосов
/ 12 февраля 2019

У меня есть угловой проект, в котором я использую форму схемы JSON ( angular6-json-schema-form ) для создания форм в схеме JSON.

Спецификация формы схемы json позволяет использовать переключатель условий для выборочного отображения / скрытия элементов на основе значения другого элемента формы.Единственными примерами, приведенными в документации, являются простые логические (если X имеет значение или нет, то показывает Y).

В моем примере мне нужно показать / скрыть ввод текста заполнителя, когда тексттип ввода выбранный из списка выбора является одним из (текст, электронная почта, URL), но НЕ показывает его, когда его (пароль, цвет).См. Приведенный ниже массив перечислений, в котором содержатся параметры, с которыми мне нужно проверить. 

{
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'
}

, который просто показывает элемент, когда выбрано НИЧЕГО, кроме NONE.

Я пробовал: 

condition: 'model,type.modelValue !== "color"'
condition: 'type.modelValue !== "color"'
condition: 'model.type !== "color"'

И ни один из них не вызывает появление заполнителяэлемент, независимо от того, что выбрано в элементе выбора типа.

1 Ответ

0 голосов
/ 15 февраля 2019

Вот рабочее решение, которое я реализовал, которое решает мой вопрос: 

layout: [
 { items: ['title', 'type'] },
 {
 type: 'section',
  condition: {
    functionBody: 'try { return model.type && model.type!=="color" && model.type!=="password" } catch(e){ return false }'
  },
  items: ['placeholder']
 },
...
]
...