knockoutjs 图像 src 未从 ko.observable 更新
knockoutjs image src not getting updated from ko.observable
我有这个代码:
<tr data-bind="foreach: ProductEffectImagesToMatch()">
<td>
<span>
<img data-bind="attr: { src: PoseId() ? ImageSrc() : '../images/style2/pose-select-placeholder.png' }, click: $root.PasteSpring"
width="120" />
</span>
</td>
</tr>
我在代码中设置了 ImageSrc,但我不确定是否需要额外调用一些东西来应用绑定,因为虽然设置了值,但我可以在 console.log 中看到图片 url 没有更新。
这是视图模型:
function EffectSelectionRootModel(imagesrc, poseid) {
var self = this;
self.ImageSrc = ko.observable();;
self.PoseId = ko.observable();
if (imagesrc) {
self.ImageSrc(imagesrc);
}
if (poseid) {
self.PoseId(poseid);
}
}
值是这样设置的:
var itemToEdit = ko.utils.arrayFirst(self.ProductEffectImagesToMatch(), function (item) {
return item;
});
if (itemToEdit) {
itemToEdit.ImageSrc = self.selectedPose().ImageUrl;
itemToEdit.PoseId = self.selectedPose().Id;
}
以及执行该代码后的视图模型:
但是页面上的图片没有更新。
知道我还需要做什么吗?
这样做
var itemToEdit = ko.utils.arrayFirst(self.ProductEffectImagesToMatch(), function (item) {
return item;
});
if (itemToEdit) {
itemToEdit.ImageSrc(self.selectedPose().ImageUrl);
itemToEdit.PoseId(self.selectedPose().Id);
}
您必须以这种方式设置新值,否则您将覆盖 observable,它将不再起作用。
我有这个代码:
<tr data-bind="foreach: ProductEffectImagesToMatch()">
<td>
<span>
<img data-bind="attr: { src: PoseId() ? ImageSrc() : '../images/style2/pose-select-placeholder.png' }, click: $root.PasteSpring"
width="120" />
</span>
</td>
</tr>
我在代码中设置了 ImageSrc,但我不确定是否需要额外调用一些东西来应用绑定,因为虽然设置了值,但我可以在 console.log 中看到图片 url 没有更新。
这是视图模型:
function EffectSelectionRootModel(imagesrc, poseid) {
var self = this;
self.ImageSrc = ko.observable();;
self.PoseId = ko.observable();
if (imagesrc) {
self.ImageSrc(imagesrc);
}
if (poseid) {
self.PoseId(poseid);
}
}
值是这样设置的:
var itemToEdit = ko.utils.arrayFirst(self.ProductEffectImagesToMatch(), function (item) {
return item;
});
if (itemToEdit) {
itemToEdit.ImageSrc = self.selectedPose().ImageUrl;
itemToEdit.PoseId = self.selectedPose().Id;
}
以及执行该代码后的视图模型:
但是页面上的图片没有更新。
知道我还需要做什么吗?
这样做
var itemToEdit = ko.utils.arrayFirst(self.ProductEffectImagesToMatch(), function (item) {
return item;
});
if (itemToEdit) {
itemToEdit.ImageSrc(self.selectedPose().ImageUrl);
itemToEdit.PoseId(self.selectedPose().Id);
}
您必须以这种方式设置新值,否则您将覆盖 observable,它将不再起作用。