我让我的 web 服务使用 knockoutjs 将 json 渲染到一组嵌套标签中。(效果很好)。
所以我现在想做的是有一个弹出编辑窗口(已经用 KendoUI\jquery 设置)来更改值。
但问题是我不知道我是否出去吃午饭,这甚至是可能的......你如何将绑定的对象传递给其他东西来处理编辑?
我让我的 web 服务使用 knockoutjs 将 json 渲染到一组嵌套标签中。(效果很好)。
所以我现在想做的是有一个弹出编辑窗口(已经用 KendoUI\jquery 设置)来更改值。
但问题是我不知道我是否出去吃午饭,这甚至是可能的......你如何将绑定的对象传递给其他东西来处理编辑?
我在我的代码中做了这样的事情:
在我的 viewModel 中,我创建了一个登录函数的实例:
this.loginDialog = ko.observable(new LoginDialog(this));
其定义如下:
function LoginDialog(viewModel) {
var self = this;
this.viewModel = viewModel;
this.userid = ko.observable();
this.password = ko.observable();
this.open = ko.observable(false);
this.message = ko.observable();
// more here
}
然后我有一个名为的绑定dialog
:
ko.bindingHandlers.dialog = {
init: function(element, valueAccessor, allBindingsAccessor) {
var options = ko.utils.unwrapObservable(valueAccessor());
setTimeout(function() {
$(element).dialog(options || {});
}, 0);
//handle disposal (not strictly necessary in this scenario)
ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
$(element).dialog("destroy");
});
},
update: function(element, valueAccessor, allBindingsAccessor) {
var shouldBeOpen = ko.utils.unwrapObservable(allBindingsAccessor().openWhen);
var options = ko.utils.unwrapObservable(valueAccessor());
var $elem = $(element);
var dynamicOptions = ko.utils.unwrapObservable(allBindingsAccessor().dynamicOpts) || {};
$elem
.dialog(shouldBeOpen ? "open" : "close");
if (dynamicOptions.title)
$elem.dialog("option", "title", ko.utils.unwrapObservable(dynamicOptions.title));
}
};
我这样称呼
<!-- ko with: loginDialog -->
<div id='logindlg' class="dialog"
data-bind="dialog: {autoOpen: false, modal: true, closeOnEscape: false, title: 'Login', height: 300, width: 550, dialogClass: 'no-close', resizable: false}, openWhen: open">
<!-- more stuff here -->
</div>
<!-- /ko -->