Угловой материал DropDown Примите значение в типе числа

Question

Я создаю приложение, используя angular-материал.

В моем приложении это будет dropdpown. Я использую * ng для данных из бэкенда mircoservice. Однако возвращаемое значение бэкэнда с типом данных number и angular-material принимает только строковое значение.

Любое решение, как разрешить угловой материал принимает числовой тип данных в качестве значения?

Ниже приведен мой исходный код.

HTML

<mat-form-field>
    <mat-select placeholder="Favorite food" [(ngModel)]="selectedValue" name="food">
      <mat-option *ngFor="let food of foods" [value]="food.value">
        {{food.viewValue}}
      </mat-option>
    </mat-select>
  </mat-form-field>

Образец JSON из микросервиса

 [
    {value: 0, viewValue: 'Steak'},
    {value: 1, viewValue: 'Pizza'},
    {value: 2, viewValue: 'Tacos'}
  ]

Я понимаю, что могу анализировать, чтобы преобразовать тип данных числа из внутреннего интерфейса и преобразовать в строку для отображения цели. И мне нужно преобразовать строку обратно в числовой тип данных, когда я кладу в микросервис.

Однако, после того, как я нажму кнопку Сохранить. Не удалось привязать мои выбранные данные, потому что я преобразовал их в числовой тип данных, когда нажал кнопку «Сохранить».

Любое решение для решения этой проблемы.