通过Knockout调用更新J-Query上下文菜单

Question

我们正在实现一个相当复杂的单页应用程序，因此决定使用“ Jquery-context-menu”工具箱。 但是，我们有一个基本的问题，经过两天的搜索和阅读网络上的内容，我们有些想法了。

基本问题是：如果是（如果是），如何操作，是否可以从菜单外访问更新功能（即禁用功能），而菜单仍处于打开状态？

场景：我们正在开发一个游戏。 我们使用“ jquery上下文菜单”作为可由用户激活的图标的上下文菜单（以rpg类型的图标为例）。 通过单击激活它后，它将自动取消激活（几秒钟后），然后准备好一段时间后再次激活。 在菜单保持打开状态时，通过启用或禁用菜单，菜单正在捕获图标的这种状态。

有一个示例，说明如何通过按同一菜单中的按钮来更改菜单项的可见性，如以下所示：

http://medialize.github.io/jQuery-contextMenu/demo/disabled-changing.html

但是，我们的目标是从现场（通过淘汰赛订阅电话）更新菜单。 所以我们想做类似的事情：

myknockoutobservable.subscribe(function(newValue){
correctRefernceToThis.data('disableItem1', newvalue)});      

而禁用的功能看起来像：

disabled: function(key, opt) {
return !this.data('cutDisabled')};       

或者，如果这不起作用，我们可以直接致电更新功能

 myKnockoutobservable.subscribe(function(newValue){
$.contextMenu.op.update(correctRefernceToOpt,correctRefernceToroot)});  

然后查询回调中的可观察到的敲除

if (!myKnockoutobservable) {
return true;}
else {
return false;   

主要的问题似乎是我们没有正确地引用上下文，因此我们没有正确的句柄来从Jquery上下文菜单之外选择对根变量进行选择（至少这是我们当前的问题）。意见）。 如果有人可以帮助我们找到解决方案，或者甚至提供一些好主意，尝试一下（我们还没有尝试），我们将非常高兴。

Answer 1

您不会订阅，在您的视图模型中只有一个可观察值（您设置为true或false），菜单项将作为响应进行切换。 菜单项的禁用成员将如下所示：

disabled: function() { 
    return myobservable();
}

正如James Thorpe所评论的那样，您将需要创建一个自定义绑定处理程序来设置上下文菜单。

听起来您正在使用几种不熟悉的工具。 这是一个带有最小示例的小提琴： http : //jsfiddle.net/sv3m7ok8/

更新在我看来，由于上下文菜单不会绑定到单个元素，而是使用选择器，因此在body标签上进行绑定更有意义。 因此，一个更新的示例： http : //jsfiddle.net/sv3m7ok8/1/

现在再次更新，我了解到您正在专门尝试使菜单项在打开菜单时启用/禁用（并且它通常不会这样做）。 我必须隐蔽地进入菜单项节点，并连接一个订阅以在其上设置禁用的类。

init: function (element, data, allbindings, data) {
    var dynamicDisable = false;
    $.contextMenu({
        selector: '.context-menu-one',
        callback: function (key, options) {
            var m = "clicked: " + key;
            window.console && console.log(m) || alert(m);
        },
        items: {
            "edit": {
                name: "Clickable",
                icon: "edit",
                disabled: function (opt, key) {
                    if (!dynamicDisable) {
                        var node = key.items.edit.$node[0];
                        data.disableMenu.subscribe(function (dis) {
                            $(node)[dis ? 'addClass' : 'removeClass']('disabled')
                        });
                        dynamicDisable = true;
                    }
                    return data.disableMenu();
                }
            }
        }
    });
}

我的小提琴设置了一个间隔来切换disableMenu。 您可以看到菜单项变为活动状态并显示为灰色。

http://jsfiddle.net/sv3m7ok8/3/

Answer 2

感谢您的帮助！ 我了解您的方法，而且确实确实是我们所做的事情：-)在这个问题上，我可能还不太清楚，但这是禁用回调的当前代码。

disabled: function(key, opt) {
                        if (!self.item._blocks.Feature._processedStack().canBeActivated()) {
                            return true;
                        }
                        else {
                            return false;
                        }
                    }

这样可以使菜单关闭并再次重新操作时，状态将被更新。 但是，在菜单仍处于打开状态时，更新无法正常进行，因为没有任何东西触发菜单更新为新值。

目前，我们正尝试使用其他库来解决此问题，这将使您保持最新状态。

最好，卡斯珀