Angular patchValue не работает с JsonConverter - PullRequest
Новая
       54

Angular patchValue не работает с JsonConverter

0 голосов
/ 14 октября 2019

У меня есть угловая форма с элементом управления select, который получает свои значения из enum на сервере. 

<select name="" id="" [formControl]="form.get('myType')">
  <option *ngFor="let type of types"  [value]="+type['key']">
    {{ type['value'] }} ({{  type['key']}})
  </option>
</select>

Я создал здесь пример с жестко закодированным ответом в переменной типов: stackblitz

Я сейчас пытаюсь заполнить форму, используясформируйте метод patchValue (см. кнопку и метод setValues). 

  setValues() {
    this.form.patchValue({
      myType: 0
    });
  }

В действительности этот ответ приходит с сервера.

Модель с сервера выглядит следующим образом: 

public class TestModel
{
    public MyType Type { get; set; }
}

Пока это работает.

Если я изменю модель на сервере для включения атрибута Json StringEnumConverter: 

public class TestModel
{
    [JsonConverter(typeof(StringEnumConverter))]
    public MyType Type { get; set; }
}

Теперь метод patchValue выглядит следующим образом (см. Кнопку и метод setValues2): 

  setValues2() {
    this.form.patchValue({
      myType: 'Type1'
    });
  }

Однако мое значение больше не загружается в элемент управления select.

Как обойти это?

Я начал создавать директиву, но не знаю, как перехватить привязки, чтобы изменить значение на эквивалент ключа enums.

Пожалуйста, помогите

Ответы [ 2 ]

0 голосов
/ 14 октября 2019

Поскольку выбранный вами элемент основан на key, однако, key со значением Type1 не существует. Таким образом, ваш [value] является нулевым. Вы можете найти его ключ по value и установить [value]: 

setValues2() {
   this.form.patchValue({
      myType: this.getKey('Type1')
   });
}

getKey(typeName:string) {
    let key = this.types.find(f => f.value === typeName).key;
    return key ? key : 0;
}
0 голосов
/ 14 октября 2019

Вы установили значение параметра как ключ свойство из типов массив 

<option *ngFor="let type of types"  [value]="+type['key']">

Но в setValues2 Метод, которым вы устанавливаете значение формы как type ['value'] , поэтому этот метод не работает. Поскольку он ожидает значения 1 или 2 , но получает Type2 .

Я думаю, вы можете попытаться установить значение параметра как объект из массива типов

<option *ngFor="let type of types"  [value]="type">

тогда ваши методы должны установить эти объекты как значение формы 

setValues() {
    this.form.patchValue({
      myType: this.types[0]
    });
  }

  setValues2() {
    this.form.patchValue({
      myType: this.types[1]
    });
  }
...