Angular JS 2如何在Dropdownlist中将选定的ID与模型绑定？

当Dropdownlist的某个值被选中并且该函数将使用所选值的ID时，我想调用该函数。我怎样才能将选定的值的id绑定到模型？我可以将数据加载到下拉列表中。Angular JS 2如何在Dropdownlist中将选定的ID与模型绑定？

<select> 
    <option *ngFor="let category of categorylist" > 
      {{ category.Description }}</option> 
        </select>

来源

2016-12-04 Amir

2方式angular2结合可以定制，我们可以在我们自己的函数调用。只需将ID绑定到ngValue，并将该值发送到DropdownChange事件。

HTML：

<select [ngModel]="selectedValue" (ngModelChange)="onDropdownChange($event)" class="form-control"> 
     <option *ngFor="let category of categorylist" [ngValue]="category.id">{{category.Description}}</option> 
    </select>

COMPONENT：

onDropdownChange(e){ 
    console.log(e)//you will get the id 
    this.selectedValue =e //if you want to bind it to your model 
}

来源

2016-12-04 16:38:31

谢谢你的解决方案。我也可以在change事件上调用函数。 – Amir

<select [(ngModel)]="selectedCategory"> 
    <option *ngFor="let category of categorylist" [ngValue]="category" > 
      {{ category.Description }}</option> 
        </select>

您阅读和阅读并分配到selectedCategory所选择的选项设置。

如果该值是一个对象（不是原始值），那么分配给selectedCategory的实例必须与[ngValue]中的实例相同。只有另一个具有相同属性和值的实例是不够的。

又见Binding select element to object in Angular 2

来源

2016-12-04 16:21:59

我要绑定选定值的id – Amir

这是比较容易的版本。只需使用[[value] =“category.id”或“[ngValue] =”category.id“'。我只是解释了一个更棘手的问题，并假设你可以自己找出更容易的问题。 –

我收到错误无法绑定到'ngModel'，因为它不是'select'的已知属性。我应该导入任何其他组件吗？ – Amir

Angular JS 2如何在Dropdownlist中将选定的ID与模型绑定？

回答

相关问题