Почему машинописный текст преобразует число в строку?

Question

У меня есть раскрывающийся список с этими значениями ниже, и когда я впервые использую начальное значение, оно не определено. Но затем, когда я перехожу на «30 минут», а затем обратно на «Любой», свойство, которое я использую в качестве ngModel, устанавливается с 30 на «undefined»! Он устанавливается в строку?

Фактическое свойство выглядит так, как показано ниже - я не понимал, что машинописный текст может преобразовать его так?

length: number;

где мой раскрывающийся список здесь

<div class="form-group">
  <label for="length">Length</label>
  <select class="form-control w-100" id="length" name="length" [(ngModel)]="eventParams.length">
    <option *ngFor="let length of lengthList" [value]="length.value">
      {{length.display}}
    </option>
  </select>
</div>

  lengthList = [
    {value: undefined, display: 'Any'},
    {value: 30, display: '30 min'},
    {value: 45, display: '45 min'},
    {value: 60, display: '60 min'},
    {value: 90, display: '90 min'}
  ];

Answer 1

Как указано в документации Angular

Атрибут Value отслеживает простые строковые значения, привязанные к элементу option. Для объектов используйте входную привязку ngValue.

Используйте атрибут ngValue, он будет работать должным образом.

<div class="form-group">
      <label for="length">Length</label>
      <select class="form-control w-100" id="length" name="length" [(ngModel)]="eventParams.length">
        <option *ngFor="let length of lengthList" [ngValue]="length.value">
          {{length.display}}
        </option>
      </select>
    </div>