Estou fazendo o aplicativo angular 6, onde estou usando a forma dinâmica angular e os valores são provenientes do JSON ..

Simple JSON:

  jsonData: any = [
    {
      "elementType": "dropdown",
      "key": 'project',
      "label": 'Choose option to display',
      "options": [
        { "key": 'inputbox', "value": 'Show Project Level as input box' },
        { "key": 'dropdown', "value": 'Show Project Level as dropdown' }
      ],
      "order": 1
    },
    {
      "elementType": "textbox",
      "class": "col-12 col-md-4 col-sm-12",
      "key": "project_level",
      "label": "Project Level as input box",
      "type": "text",
      "value": "",
      "order": 2
    },
    {
      "elementType": "dropdown",
      "key": 'project_level',
      "label": 'Choose Project Level as dropdown',
      "options": [
        { "key": 'low', "value": 'Low' },
        { "key": 'medium', "value": 'Medium' },
        { "key": 'high', "value": 'High' }
      ],
      "order": 2
    }
  ];

requisito será somente deste jso

Dê uma olhada emClaro exemplo de trabalho https: //stackblitz.com/edit/angular-x4a5b6-5ys5h,

Você pode ver, no estágio inicial, que estou com a caixa de entrada e o dropdwon. Mas eu preciso ter uma caixa de texto sozinha no início, se eu escolher a opção Mostrar nível do projeto como menu suspenso no primeiro menu suspenso, a tecla project_level precisará ser alterada conforme a caixa de seleção e vice-versa vai acontecer ..

Order 1 tem um menu suspenso no qual tenho duas opções,

      "options": [
        { "key": 'inputbox', "value": 'Show Project Level as input box' },
        { "key": 'dropdown', "value": 'Show Project Level as dropdown' }
      ],

Se escolhermos oprimeir opção que tem valor comoShow Project Level como caixa de entrada, se escolhermossegund opção que tem valorMostrar o nível do projeto como suspenso ..

Com base na seleção acima, preciso alterar o elemento do formulário de acordo, digamos que o usuário escolheuShow Project Level as input box, então eu preciso exibir ocaixa de entrad,

    {
      "elementType": "textbox",
      "class": "col-12 col-md-4 col-sm-12",
      "key": "project_level",
      "label": "Project Level as input box",
      "type": "text",
      "value": "",
      "order": 2
    },

Whereas se o usuário escolherShow Project Level as dropdown, então eu preciso exibir osuspens,

    {
      "elementType": "dropdown",
      "key": 'project_level',
      "label": 'Choose Project Level as dropdown',
      "options": [
        { "key": 'low', "value": 'Low' },
        { "key": 'medium', "value": 'Medium' },
        { "key": 'high', "value": 'High' }
      ],
      "order": 2
    }

Então ochav será único sozinho project_level mas o elemento do formulário sozinho precisa ser alterado com base na seleção da caixa de entrada ou da caixa de seleção ..

Kindly me ajude a alterar o elemento do formulário com base na seleção emorder 1 suspenso.

O resultado é esperado apenas usando a maneira angular pura e datilografada / javascript sem jquery ..