Angular 选择“角度选择”时显示选项的值

我是个新手。我对select标记有问题。我有一个国家名称和国家代码列表。当我选择一个选项时，我希望选择仅显示国家代码（选项值）的结果，而不是国家名称和国家代码。 例如：

美国：+1
THA:+66
年龄：+56
越南盾：+84

当我选择美国时，选择标签将在屏幕上显示“美国：+1”，但我只想在此显示“+1”

---

有什么解决办法吗？如果是，请给我任何示例代码。非常感谢

在标记中，您可以使用默认选定值定义隐藏的第一个选项，并为

（更改）

事件设置处理程序：

<select (change)="onSelectChange($event)">
  <option hidden value="+1">+1</option>
  <option value="+1">USA: +1</option>
  <option value="+66">THA: +66</option>
  <option value="+56">CHL: +56</option>
  <option value="+84">VN: +84</option>
</select>

---

请参见演示。

我尝试了如下演示：

<select (click)="status=!0" (mouseout)="status=!1" style="width:120px">
    <option value="+1">{{status ? 'USA: ' : ''}}+1</option>
    <option value="+66">{{status ? 'THA: ' : ''}}+66</option>
    <option value="+56">{{status ? 'CHL: ' : ''}}+56</option>
    <option value="+84">{{status ? 'VN: ' : ''}}+84</option>
</select>

{{状态？'USA:'：'}}+1
{{状态？'THA:'：'}}+66
{{状态？'CHL:'：'}}+56
{{状态？'VN:'：'}}+84

---

你可以做得更好

把美国从名单上删除element@Chellappan你能解释一下怎么做吗？谢谢这就是你想要的不，先生。元素选项应为：USA:+1，选择时为。选择标签只显示电话号码（+1-这是您选择的选项值）@Chellappan I更新了此案例的图像谢谢ConnorsFan。成功了。但是如果我想将“USA:+1”设置为默认值，如何设置，先生？@John-我更新了答案和stackblitz，将

USA:+1

显示为默认值。哦，对不起，也许我的问题不清楚。我的问题是如何将值“+1”设置为默认值？因为我不知道如何获得select并将其设置为与onSelectChange（）中相同的值，这太完美了。非常感谢！

onSelectChange(event: Event) {
  let select = event.target as HTMLSelectElement;
  select.options[0].value = select.value;
  select.options[0].text = select.value;
  select.selectedIndex = 0;
}

<select (click)="status=!0" (mouseout)="status=!1" style="width:120px">
    <option value="+1">{{status ? 'USA: ' : ''}}+1</option>
    <option value="+66">{{status ? 'THA: ' : ''}}+66</option>
    <option value="+56">{{status ? 'CHL: ' : ''}}+56</option>
    <option value="+84">{{status ? 'VN: ' : ''}}+84</option>
</select>