Отображение одного значения и отправка другого через html datalist и * ngFor

Question

Я создаю текстовое поле автозаполнения, используя <datalist> с функциональностью *ngFor, однако код, который я использую, отображает то, что я объявляю как [value], а также то, что я ввожу между тегами <option>...

Вот блик стека

Это представление о том, что я получаю, когда автозаполнение присутствует:

Из строки кода:

Я бы ожидал, что в окне автозаполнения будет отображаться только {{d.val}}, ноотправить {{d.name}} когда моя форма отправлена.

Почему она отображает {{d.val}} И {{d.name}}, и есть ли способ, которым я могу отобразить одну и отправить другую?

Answer 1

Тег datalist по определению отобразит атрибут value каждого option в списке выбора, а затем вы дополнительно отобразите {{d.val}} как метку (например, как атрибут label).).Также смотрите этот ответ .

datalist, который ведет себя иначе, чем select.Невозможно иметь различные значения отображения / отправки для него без написания дополнительного кода JavaScript.