淘汰赛似乎不喜欢！ （感叹号）在我的功能之前

Question

我需要显示/隐藏按钮，具体取决于：

• （1）有一些待定的更改
• （2）已有正在保存

我对这两个条件有canSave函数。

我的viewModel：

var canSave = ko.computed(function () {
    return hasChanges() && !isSaving();
});

下面是我使用此canSave函数的html：

• 仅在Remove
时显示canSave按钮
• 仅在Save
时显示canSave按钮
• 仅在Cancel
时显示canSave按钮

我的HTML：

<a data-bind="visible: !router.activeItem().canSave, 
              click: router.activeItem().deleteDocuments">
    Remove
</a>

<a data-bind="visible: router.activeItem().canSave, 
              click: router.activeItem().save">
    Save
</a>

<a data-bind="visible: router.activeItem().canSave, 
              click: router.activeItem().cancel">
    Cancel
</a>

它适用于Save＆amp; Cancel按钮但它不适用于Remove按钮：该按钮永远不可见。似乎!函数之前的canSave是问题所在。

PS：我只有在没有挂起的更改且没有正在进行保存的情况下才需要显示Remove按钮。这就是我需要致电!router.activeItem().canSave

的原因

---

更新

最后，我通过使用ko if这样的条件包围我的html链接来实现它：

<!-- ko if: router.activeItem().canUpdate -->
    <a data-bind="visible: !router.activeItem().canSave(), 
                  click: router.activeItem().deleteDocuments">
        Remove
    </a>

    <a data-bind="visible: router.activeItem().canSave(), 
                  click: router.activeItem().save">
        Save
    </a>
    <a data-bind="visible: router.activeItem().canSave(), 
                  click: router.activeItem().cancel">
        Cancel
    </a>
<!-- /ko  -->

请注意，我没有在ko if: router.activeItem().canUpdate的末尾设置括号。

这样做的好处是当在另一个（durandal）页面上导航时，如果目标页面没有canUpdate功能，它将不会“深入到我的html”并且不会出现错误目标页面上不存在的表达式!router.activeItem().canSave()。

Answer 1

在表达式中使用时，您应该解包计算canSave：

<a data-bind="visible: !router.activeItem().canSave(), 
              click: router.activeItem().deleteDocuments">
    Remove
</a>