如何将 ngModel 值与 angular 2 中的下拉选项列表绑定？

Question

例子：

<p-dropdown name="senderId" [options]="senderIdList" [filter]="true" required 
    #senderIdDrpdwn="ngModel" [(ngModel)]="selectedSenderId"></p-dropdown>

在 senderIdList = 中包含所有值的列表。 在 selectedSenderId = 中具有来自 senderIdList 的值。

但是 output 仅在我 select 在下拉列表中显示列表但我希望加载值是（在 ngModel 中）然后单击下拉列表显示所有列表（senderIdList）。

谢谢。

Answer 1

这是工作示例

  selected: any;
  cities = {};

  countries = [
    {
      id: 1,
      name: "Sri lanka"
    },
    {
      id: 2,
      name: "India"
    },

    {
      id: 3,
      name: "Japan"
    }
  ];

  ngOnInit() {

  }

  onChange(deviceValue) {
    console.log(
      "Changed Value is ",
      deviceValue,
      "name",
      this.countries[deviceValue].name
    );
    this.selected = this.countries[deviceValue - 1].name;
   }

.html

<select name="city" class="rounded-inputs20 select-select col-md-3" (change)="onChange($event.target.value)">
  <option *ngFor="let country of countries"  [value]="country.id" >{{country.name}}</option>
  </select>
{{selected}}