KnockoutJS - ViewModel (祖父 - 父 - 子)访问子元素中的父函数
KnockoutJS - ViewModel (Grandparent - Parent - Child) Accessing a Parent Function within Child element
我在挖空和挖空映射、客户视图模型、工作订单视图模型和修复视图模型中设置了祖父、父、子视图模型关系。
对于每个级别,如果记录已被修改,则 I 标记。 然后我有一个保存按钮来保存整个模型。 保存模型的函数位于祖父视图模型 (客户视图模型) 中
子级别元素的示例
<input class="form-control input-sm text-right" name="RepairCost" id="RepairCost" data-bind="value: RepairCost, event: {change: flagRepairAsEdited}" />
有没有办法在flagRepairAsEdit函数中调用父级/祖父级中的SAVE函数?
非常感谢!
这是我正在使用的JS代码(简化):
var ObjectState = {
Unchanged: 0,
Added: 1,
Modified: 2,
Deleted: 3
};
var workOrderMapping = {
'WorkOrders': {
key: function (workOrders) {
return ko.utils.unwrapObservable(workOrders.WorkOrderId);
},
create: function (options) {
return new WorkOrderViewModel(options.data);
}
},
'Repairs': {
key: function (repairs) {
return ko.utils.unwrapObservable(repairs.RepairId);
},
create: function (options) {
return new RepairViewModel(options.data);
}
}
};
RepairViewModel = function (data) {
var self = this;
ko.mapping.fromJS(data, workOrderMapping, self);
self.flagRepairAsEdited = function () {
if (self.ObjectState() != ObjectState.Added) {
self.ObjectState(ObjectState.Modified);
}
//WOULD LOVE TO CALL SAVE FUNCTION HERE
return true;
}
;
}
WorkOrderViewModel = function (data) {
var self = this;
ko.mapping.fromJS(data, workOrderMapping, self);
self.flagWorkOrderAsEdited = function () {
if (self.ObjectState() != ObjectState.Added) {
self.ObjectState(ObjectState.Modified);
}
//WOULD LOVE TO CALL SAVE FUNCTION HERE
return true;
}
;
}
CustomerViewModel = function (data) {
var self = this;
ko.mapping.fromJS(data, workOrderMapping, self);
self.save = function () {
$.ajax({
url: "/Customers/Save/",
type: "POST",
data: ko.toJSON(self),
contentType: "application/json",
success: function (data) {
ko.mapping.fromJS(data.customerViewModel, workOrderMapping, self);
if (data.newLocation != null)
window.location = data.newLocation;
},
});
},
self.flagCustomerAsEdited = function () {
if (self.ObjectState() != ObjectState.Added) {
self.ObjectState(ObjectState.Modified);
}
return true;
}
;
}
有两种方法可以做到这一点
a) 将视图模型作为子函数的参数传递flagRepairAsEdited
:
data-bind="value: RepairCost, event: {change: flagRepairAsEdited.bind($data, $parent, $root)}"
b) 将父视图模型的链接保存在子视图模型中
WorkOrderViewModel = function (data, parent) {
this.parent = parent;
...
}
并使用parent.flagWorkOrderAsEdited
和parent.parent.flagWorkOrderAsEdited
保存父视图模型和祖父视图模型
相关文章:
- 使用 jQuery 的 .on 函数如何获取事件的原始元素
- 在函数中添加数组元素的数值
- 如何在DOM元素上按类型构建此函数
- 是否有一个JS/jQuery函数可以获取某个类的每个元素的ID
- 如何计算每个元素's的高度,并将这些值用作函数中的变量
- Rails/Javascript链接到用于切换多个元素的函数
- 如何在HTML元素上创建函数,而不是将元素作为参数传递
- jQuery在元素的上下文中运行函数
- 如何在模板聚合物中使用元素函数
- Append元素在运行两次函数后不显示
- 当元素可见时,jQuery滚动函数会触发一次
- 如何将一个函数附加到一个不存在的元素上
- 带有事件的触发元素函数
- 是否可以从另一个元素访问元素函数?聚合物1.0
- 单击的元素函数参数的值错误
- 为什么不在DOM元素函数上应用工作呢?
- 未定义的错误:创建带有返回HTML元素函数的对象
- node . js,节点.IO -使用"each"迭代元素函数停止服务器
- 将循环变量作为元素函数中的参数传递
- 动态添加的元素函数调用不工作