Question

我想格式化价格并以适当的格式打印。例如，5000000将显示为5,000,000美元。谁能告诉我怎么做？

＆＃13;

<span data-bind="text:Price"></span>

<span data-bind="function()"></span>

＆＃13;

我可以编写一个内联函数来获取值并格式化吗？可以将text：Price的值传递给formatfunction（）吗？

＆＃13;

formatfunction(label){return  '$' + label.value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");

＆＃13;

Answer 1

关于Knockout的一个聪明之处是绑定是代码片段，所以你可以在其中使用表达式。所以你可以调用一个函数：

<span data-bind="text:formatfunction(Price)"></span>

通常，尽量不要让表达式变得非常复杂。复杂的表达式属于您的viewmodel。

Answer 2

您可以使用敲除计算变量，请参阅淘汰赛的examples。

Answer 3

您可以使用以下示例。

(function() {
    function refresh(element, valueAccessor) {
        var val = ko.utils.unwrapObservable(valueAccessor());
        var text =  '$' + val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
        $(element).text(text);
    }

    ko.bindingHandlers.priceText = {
        init: refresh,
        update: refresh
    }
})();

<span data-bind="priceText:Price"></span>

这将使您保持模型清洁，不受特定于UI的限制＆＃34;格式化＆＃34;计算，因此将使其更可重用。此外，您可以将价格观察值添加到您想要的任何模型，而无需每次都添加计算值。

Answer 4

function ViewModel() {

var self=this;
self.formatfunction=function(label){
                    console.log(label);
                    return  '$' + label.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
};

ko.applyBindings(new ViewModel());

<span data-bind="text:$parent.formatfunction(Price)"></span>

将数据绑定参数传递给函数knockout

4 个答案: