我有一个可观察的文化特定对象集合。需要从主编辑屏幕单独编辑/显示不变项目。
问题是 - 我可以双向绑定到集合中的单个项目。
这个更加复杂的UI / Viemodel的简化版本可以在这个小提琴上找到:
我在我的视图模型中尝试了计算的可写属性,但它没有检测到集合中何时更改了不变项
您的意见将不胜感激。代码列在下面:
var ItemDescription = function () {
var me = this;
me.CultureInvariantId = ko.observable(0);
me.CultureFormat = ko.observable('');
me.Description = ko.observable('');
me.IsInvariant = ko.observable(false);
};
function viewModel()
{
var me = this;
me.Name = ko.observableArray();
me.InvariantName = ko.observable('');
}
function Initialize()
{
var model = new viewModel();
var invItemDescription = new ItemDescription();
invItemDescription.Description('Invariant description');
invItemDescription.CultureFormat ('');
invItemDescription.IsInvariant = true;
model.Name.push(invItemDescription);
var usItemDescription = new ItemDescription();
usItemDescription.Description('USA description');
usItemDescription.CultureFormat ('en-US');
usItemDescription.IsInvariant = false;
model.Name.push(usItemDescription);
return model;
}
ko.applyBindings(new Initialize());
答案 0 :(得分:1)
如果我理解你要做什么,那么我认为一个不错的选择是创建一个代表不变ItemDescription
对象的计算observable。然后,您可以使用with
绑定将编辑器绑定到其属性。
类似的东西:
function viewModel()
{
var me = this;
me.Name = ko.observableArray();
me.SelectedName = ko.observable();
me.InvariantName = ko.computed(function() {
return ko.utils.arrayFirst(me.Name(), function(name) {
return name.IsInvariant;
});
});
}
使用标记:
<select data-bind="options: Name, optionsText: 'Description', value: SelectedName">
</select>
<div data-bind="with: SelectedName">
<textarea data-bind="value: Description"> </textarea>
</div>
Edit Invariant:
<div data-bind="with: InvariantName">
<input type="input" data-bind="value: Description" />
</div>