KnockoutJS - 綁定選擇選項的一個對象

Question

類似this post ...

這是我的財產視圖模型：

function propertyViewModel() { 
    var self = this; 
    self.propertyTypeList = ko.observableArray([]); 
    self.selectedPropertyType = ko.observable(); 
} 

這是我的財產類型的模型：

function propertyTypeModel(id, name) { 
    this.Id = ko.observable(id); 
    this.Name = ko.observable(name); 
} 

我用signalR從數據庫中獲取數據，並在成功時調用以下客戶端函數：

connection.client.populatePropertyTypeList = function (propertyTypeList) { 
    var mappedTypes = $.map(propertyTypeList, function (item) { 
     return new propertyTypeModel(item.Id, item.Name); 
    }); 
    self.propertyTypeList(mappedTypes); 
}; 

和：

connection.client.populatePropertyDetails = function (property) { 
    self.selectedPropertyType(new propertyTypeModel(property.PropertyType.Id, property.PropertyType.Name)); 
}; 

首先一個填充具有的所有可能的屬性類型的可觀察到的陣列和第二個獲取的相關屬性類型並將其綁定到selectedPropertyType。

一切正常，直到我嘗試引入一個下拉列表，如下與selectedPropertyType的名稱預先填充它：

<select data-bind="options: propertyTypeList, optionsText: 'Name', value: selectedPropertyType"></select> 

這使我觀察到的物體（selectedPropertyType）改變其值列表中的第一個可用選項。 我的理解是，雖然此列表呈現propertyTypeList尚未填充並導致selectedPropertyType默認爲第一個可用值，但爲什麼Knockout在調用connection.client.populatePropertyDetails時不更新對象？

我可以將選擇列表綁定到Id，如果我引入一個新的對象只有Id，但是我想讓它綁定到整個selectedPropertyType對象。可能嗎？

Answer 1

您在populatePropertyDetails回調中創建一個新對象。

儘管它有在propertyTypeList爲this.Id和this.Name作爲相應的對象相同的屬性值，它是不一樣的對象。

試着改變你的回調到這一點：

connection.client.populatePropertyDetails = function (property) { 
    var type = property.PropertyType, 
     list = self.propertyTypeList(); 

    var foundType = ko.utils.arrayFirst(list, function(item) { 
     return item.Id() == type.Id && item.Name() == type.Name; 
    }); 
    if(foundType) { 
     self.selectedPropertyType(foundType); 
    } 
};