Question

我有一个简单的页面，其中包含一些控件：

<div id="ActionMenu">
    <ul id="panelbar"
        data-role="panelbar"
        data-bind="events: { enable: onEnable, collapse: onCollapse }">
        <li id="item1">
            <span>Action menu</span>
            <div>
                <div class="panelActions">
                    <button data-role="button"
                            data-bind="visible: isVisible, enabled: isEnabled, events: { click: onClick }"
                            id="logOutButton">
                        Log users out
                    </button>
                </div>
            </div>
        </li>
    </ul>
</div>

然后我做这样的事情来创建一个视图模型并绑定东西：

var vm;
require(['App/Admin/userInfoGrid'], function (userInfo) {
    vm = userInfo.UserInfoGrid(config_UserInfo);
    kendo.bind($(config_UserInfo.gridId), vm);
    kendo.bind($(config_UserInfo.actionMenu), vm.ActionMenu);
    kendo.bind($(config_UserInfo.logOutButton), vm.LogOutButton);
    kendo.bind($(config_UserInfo.messageWindow), vm.MessageWindow);
});

在页面中有多个控件，所以我用这种方式绑定所有控件。

在vm中：

  this.ActionMenu = kendo.observable({
            expandMode: "single",
            //onCollapse: onCollapse,
            //onEnable: function(e) {
            //    alert("on enable");
            //}
        });

这样可行，但我使用的面板栏上有方法和事件，我想使用它们。

到目前为止，如果我想在viewModel中使用内置方法和事件，我必须做这样的事情：

var panelBar = $(config.actionMenu).data("kendoPanelBar");
panelBar.enable($("#item1"), false);

如果我试图抓住并检查可观察物：

console.log(that.ActionMenu)

它没有剑道内置方法，只有我自己定义的方法。

由于我不想重新发明轮子并重新实现所有应该已经存在的方法，有没有办法让我的ActionMenu可以访问＆＃34; kendoPanelBar＆＃ 34;功能？

因为它们毕竟是相同的控件，我想我必须有某种方式让它像这样工作：

that.ActionMenu.enable($("#item1"), false);

有什么想法吗？此特定示例适用于panelBar，但同样的问题适用于所有其他控件。提前致谢

如何在使用MVVM时在viewmodel中获取Kendo控件

0 个答案: