нокаут JS и глобализация - PullRequest
Новая
       1

нокаут JS и глобализация

8 голосов
/ 15 сентября 2011

Я не могу понять, как обрабатывать вычисления, используя нокаут js и не американский язык. Моя запятая есть, и она корректно проверена с помощью плагина jquery.globalization, но расчет выбивания дает мне NaN. Поддерживает ли это нокаут js или есть какие-то обходные пути?

Пример:

Сделать пример cartEditor на сайте knockout js, разрешив десятичные значения в поле количества и разрешив глобальный ввод (в виде знака запятой) и форматирование вывода

http://knockoutjs.com/examples/cartEditor.html

Мне нужно, чтобы это работало на сайте asp.net mvc 3, потому что я работаю на этом сайте с использованием культуры nb-NO, а связыватель модели ожидает, что в качестве запятой

Ответы [ 2 ]

7 голосов
/ 05 ноября 2011

Я сделал что-то подобное, написав пользовательскую привязку, которая обернула autoNumeric.js для форматирования. ( суть ) 

ko.bindingHandlers.autoNumeric = function ($) {

    function getElementValue(el) {
        return parseFloat(el.autoNumericGet(), 10);
    }

    function getModelValue(accessor) {
        return parseFloat(ko.utils.unwrapObservable(accessor()), 10);
    }

    return {
        init: function (el, valueAccessor, bindingsAccessor, viewModel) {
            var $el = $(el),
                bindings = bindingsAccessor(),
                settings = bindings.settings,
                value = valueAccessor();

            function updateModelValue() {
                value(getElementValue($el));
            };

            $el.autoNumeric(settings);
            $el.autoNumericSet(getModelValue(value), settings);
            $el.change(updateModelValue);
        },
        update: function (el, valueAccessor, bindingsAccessor, viewModel) {
            var $el = $(el),
                newValue = getModelValue(valueAccessor()),
                elementValue = getElementValue($el),
                valueHasChanged = (newValue != elementValue);

            if ((newValue === 0) && (elementValue !== 0) && (elementValue !== "0")) {
                valueHasChanged = true;
            }

            if (valueHasChanged) {
                $el.autoNumericSet(newValue);
                setTimeout(function () { $el.change() }, 0);
            }
        }
    };
}

привязка данных с использованием этой пользовательской автоматической числовой привязки выглядит следующим образом: 

<input data-bind="autoNumeric:amount, settings:{aSign:'$'}" />

Ознакомьтесь с расширенными опциями форматирования autoNumeric.js, чтобы узнать, что вы можете делать с настройками.

2 голосов
/ 29 марта 2013

Изменено, чтобы сделать его совместимым с последней автоматической числовой версией (1.9.x) 

(function($) {

    function getElementValue(el) {
        return parseFloat(el.autoNumeric('get'), 10);
    }

    function getModelValue(accessor) {
        return parseFloat(ko.utils.unwrapObservable(accessor()), 10);
    }

    ko.bindingHandlers.autoNumeric = {
        init: function (el, valueAccessor, bindingsAccessor, viewModel) {
            var $el = $(el),
                bindings = bindingsAccessor(),
                settings = bindings.settings,
                value = valueAccessor();

            function updateModelValue() {
                value(getElementValue($el));
            };

            if (settings.pSign === 's') {
                settings.aSign = ' ' + settings.aSign;
            } else {
                settings.aSign = settings.aSign + ' ';
            }

            $el.autoNumeric(settings);
            $el.autoNumeric('set', getModelValue(value));
            $el.change(updateModelValue);
        },
        update: function (el, valueAccessor, bindingsAccessor, viewModel) {
            var $el = $(el),
                newValue = getModelValue(valueAccessor()),
                elementValue = getElementValue($el),
                valueHasChanged = (newValue != elementValue);

            if ((newValue === 0) && (elementValue !== 0) && (elementValue !== "0")) {
                valueHasChanged = true;
            }

            if (valueHasChanged) {
                $el.autoNumeric('set', newValue);
                setTimeout(function () { $el.change() }, 0);
            }
        }
    };
})(jQuery);
...