如何从下拉列表中由可观察数组填充的选定项中检索完整对象

How do I retrieve the full object from a selected item in dropdown that was filled by an observable array?

本文关键字:检索 对象 数组 下拉列表 观察 填充      更新时间:2023-09-26

假设我有下拉列表:

<select id="department-options" 
data-bind="options: departments, optionsText: 'Name', optionsValue: 'DepartmentId', value: departmentId" />

这个下拉列表通过 KNOCKOUT js 绑定到一个复杂对象:

this.departmentId = ko.observable();
this.departments = ko.observableArray([]);
this.setDepartments = function(){
    $.get('myserviceurl', departments);
}

列表很好,值可以很好地更新视图模型中的部门 ID。问题是该服务实际上返回包含多个属性的对象列表。下拉列表的绑定仅定义在何处获取文本、在何处获取值以及如何处理所选值。在选择更改时,我还想与这些对象的其他成员一起做一些其他事情。

例如,如果加载到 this.departments 中的对象包含一个名为 subdepartmentOfId 的属性,我如何检索列表中当前选定项的该属性?我的第一直觉是抓住选定的索引并在可观察数组中找到它,但这听起来不可靠,似乎有一种更简单的方法可以做到这一点。

我几乎一发帖就想通了:

<select id="department-options" 
data-bind="options: departments, optionsText: 'Name', optionsValue: $root, value: selectedDepartment" />

将选项值更改为$root然后通过this.selectedDepartment().subdepartmentOfId访问属性