Как добавить Dropdown / selectbox внутри JSON -EDITOR в angular - PullRequest
1 голос
/ 08 апреля 2020

Я использую angular JSON -редактор для добавления некоторых полей int к моим данным.

https://www.npmjs.com/package/ang-jsoneditor

https://stackblitz.com/edit/ang-jsoneditor

Это мое значение по умолчанию JSON - Значение редактора:

{ "color": { "property": 'Configurable', "Values": [] }, "material": { "property": 'Configurable', "Values": [] }, "size": { "property": 'Configurable', "Values": [] }}

Требуется мое требование для интеграции поля выбора для property атрибуты с некоторыми значениями c.

Как включить раскрывающийся список в редакторе JSON.

Есть ли опция?

Любая помощь поможет быть оцененным.

1 Ответ

0 голосов
/ 15 апреля 2020

Наконец я получил ответ:

    @ViewChild(JsonEditorComponent, { static: true }) editor: JsonEditorComponent;
    this.editorOptions = new JsonEditorOptions()
    this.editorOptions.modes = ['code', 'text', 'tree', 'view']; 
    this.editorOptions.expandAll = true;
    this.editorOptions.schema ={
  'definitions': {},
  '$schema': 'http://json-schema.org/draft-07/schema#',
  '$id': 'http://example.com/root.json',
  'type': 'object',
  'title': 'Product Attributes',
  'required': [
    'property'
  ],
  'properties': {
    'property': {
      '$id': '#/properties/randomNumber',
      'type': 'string',
      'title': 'Attribute property',
      'default': 'Configurable',
      'examples': [
        'Configurable'
      ],
      'enum': ['Configurable','Simple']
    }
  }
}

Я добавил схему JSON с помощью new JsonEditorOptions() и установил значения раскрывающегося списка, используя ключевое слово Enum 'enum': ['Configurable','Simple']. Теперь он появится в выпадающем списке выбора.

И вы можете прочитать значение редактора Json в onChangeJSON

  this.editorOptions.onChangeJSON = function () {
     const json = this.editor.get();   
     console.log(json);
  };
...