html - 如何设置 Angular 2+ 下拉默认值？ [现有问题没有回答我的问题]

Question

当我尝试像下面这样用空值设置默认值时，它的工作

destChannelList = [
    {
      "channelId":"",
      "channelName":"SMS"
    },
    {
      "channelId":1,
      "channelName":"Voice"
    },
    {
      "channelId":2,
      "channelName":"FaceBook"
    }
  ];

但是当我有一个值如下所示的 channelId 时，它不会选择第一个值:

destChannelList = [
    {
      "channelId":0,
      "channelName":"SMS"
    },
    {
      "channelId":1,
      "channelName":"Voice"
    },
    {
      "channelId":2,
      "channelName":"FaceBook"
    }
  ];

请在此处查看示例代码:

https://stackblitz.com/edit/angular-mribg5?file=src%2Fapp%2Fapp.component.html

请注意，我知道有很多关于这个问题的问题，但没有一个能解决我的问题。请不要标记为重复。与我分享答案链接。

Answer 1

您的下拉 ngValue 是来自对象数组的“channelId”。

默认值应与对象数组中的任何“channelId”相匹配。

什么时候

selectedDestChannel = '';

匹配

{
  "channelId":"",
  "channelName":"SMS"
},

像这样设置默认值等于任何“channelId”

name = 'Angular';
destChannelList = [
  {
    "channelId":0,
    "channelName":"SMS"
  },
  {
    "channelId":1,
    "channelName":"Voice"
  },
  {
    "channelId":2,
    "channelName":"FaceBook"
  }
];
selectedDestChannel : any;
constructor(){
   //set default;
   this.selectedDestChannel = this.destChannelList[0].channelId;
}