按钮没有击中 Knockout js 中的 if 语句

Question

我有以下按钮

    <div class="pull-right" data-bind="tooltip: { title: DashboardEdit, placement: 'top' }">
    <button class="btn actionButtonIcon" id="DashboardEdit" data-bind="click: changeButtonText">
        <figure>
            <img src="../../../Images/NotesPink.png" />
            <figcaption data-bind="text: $data.ProcurementbuttonText() ? 'Save': 'Edit'"></figcaption>
        </figure>
    </button>
</div>

它在点击时改变文本，现在我想要实现的是当按钮文本显示保存时它应该执行一个功能，所以我试过这个：

            self.ProcurementbuttonText = ko.observable(false);

        self.changeButtonText = function(){
            self.ProcurementbuttonText(!self.ProcurementbuttonText())
            if (self.ProcurementbuttonText() === 'Save'){
            var data = {
                'ScorecardId':ko.observable(localStorage.getItem('scorecardId'))(),
                'DashboardConfig':ko.observable(localStorage.getItem('ElementDataWidget'))()
            };
            PreferentialProcurementDashboardApi.Save(data);           
        }
    }

所以当 ProcurementButtonText = save 时，它应该执行 if 语句中的所有操作，但我看到它永远不会碰到 if 语句

我做错了什么？

Answer 1

我认为问题出在您在 self.ProcurementbuttonText() 中的预期，因为您使用这样的布尔值进行设置 - self.ProcurementbuttonText(false); 然后在 changeButtonText 函数中切换它 self.ProcurementbuttonText(!self.ProcurementbuttonText()) .您要检查的下一行是否等于 'Save' 而它永远不会等于。它只会是真或假。所以这个检查只需要

if (self.ProcurementbuttonText()){
    var data = {
        'ScorecardId':ko.observable(localStorage.getItem('scorecardId'))(),
        'DashboardConfig':ko.observable(localStorage.getItem('ElementDataWidget'))()
    };
    PreferentialProcurementDashboardApi.Save(data);           
}

我建议您查看变量的命名方式以及它们的用途，因为 self.ProcurementbuttonText 误解了它实际包含的内容。目前它包含此记录的 view/edit 状态，而不是采购按钮的文本。

Answer 2

self.ProcurementbuttonText(!self.ProcurementbuttonText())

你在上面一行中有错误。在这里，您将这个可观察的 var "ProcurementbuttonText" 值设置为 true 或 false。这始终是一个布尔值。所以它的值永远不会等于 "Save"。在 if 条件中，您正在检查它是否等于 "Save"，这始终为 false。这意味着它永远不会执行该部分。

按钮没有击中 Knockout js 中的 if 语句

Button not hitting if statement in Knockout js

knockout.js