JHipster fieldset переключателей - PullRequest
Новая
       35

JHipster fieldset переключателей

1 голос
/ 15 января 2020

В проекте jhipster у меня есть поле Enumeration со значением «A, B, C, D, E». При «стандартном» подходе Jhipster будут использоваться Select / Options: 

<div class="form-group">
                    <label class="form-control-label" jhiTranslate="myApp.myEntity.myField" for="field_myField">myField</label>
                    <select class="form-control" name="myField" formControlName="myField" id="field_myField">
                        <option value="A">{{'myApp.MyFieldType.A' | translate}}</option>
                        <option value="B">{{'myApp.MyFieldType.B' | translate}}</option>
                        <option value="C">{{'myApp.MyFieldType.C' | translate}}</option>
                        <option value="D">{{'myApp.MyFieldType.D' | translate}}</option>
                        <option value="E">{{'myApp.MyFieldType.E' | translate}}</option>
                    </select>
                </div>

Вместо них мне нужно использовать переключатели, поэтому я изменяю это на: 

<div class="form-group">
                    <label class="form-control-label" jhiTranslate="myApp.myEntity.myField" for="field_myField">myField</label>
                    <fieldset class="form-control" name="myField" formControlName="myField" id="field_myField">
                        <input type="radio" value="A" name="field_myField">{{'myApp.MyFieldType.A' | translate}}</input>
                        <input type="radio" value="B" name="field_myField">{{'myApp.MyFieldType.B' | translate}}</input>
                        <input type="radio" value="C" name="field_myField">{{'myApp.MyFieldType.C' | translate}}</input>
                        <input type="radio" value="D" name="field_myField">{{'myApp.MyFieldType.D' | translate}}</input>
                        <input type="radio" value="E" name="field_myField">{{'myApp.MyFieldType.E' | translate}}</input>
                    </fieldset>
                </div>

Графически все в порядке, но значения, считанные из БД, не отображаются (радиокнопка не выбрана), а изменения не передаются бэкэнду. Может быть, это не правильный способ отображения переключателей? Как это сделать?

1 Ответ

1 голос
/ 15 января 2020

Использование: 

<div class="form-group">
  <label class="form-control-label" jhiTranslate="myApp.myEntity.myField" for="field_myField">myField</label>
    <fieldset class="form-control" name="myField" id="field_myField">
      <input type="radio" value="A" formControlName="myField">{{'myApp.MyFieldType.A' | translate}}</input>
      <input type="radio" value="B" formControlName="myField">{{'myApp.MyFieldType.B' | translate}}</input>
      <input type="radio" value="C" formControlName="myField">{{'myApp.MyFieldType.C' | translate}}</input>
      <input type="radio" value="D" formControlName="myField">{{'myApp.MyFieldType.D' | translate}}</input>
      <input type="radio" value="E" formControlName="myField">{{'myApp.MyFieldType.E' | translate}}</input>
    </fieldset>
  </div>

См. Например https://dev.to/bitovi/angular-forms-several-ways-reactive-nested-across-routes-42g3

...