Я пытаюсь написать пользовательские привязки нокаута к некоторым функциям "рендеринга" JavaScript, чтобы я мог делать такие вещи, как:
<td data-bind="numeral('0%'): interest">
За кулисами эта гипотетическая цифра будет делать что-то вроде:
ko.bindingHandlers.numeral(fmt) = {
init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContent) {
var unwrapped = ko.unwrap(valueAccessor()), allBindings = allBindingsAccessor();
$(element).html(numeral(unwrapped).format(fmt));
}
}
Я дал это определение go, и JavaScript действительно не понравилось, что я пытаюсь абстрагироваться от цифрового ключа. Как мне подойти к проблеме?
Попробуйте это.
<td data-bind="numeral: interest, fmt : '0%'">
И привязка
ko.bindingHandlers.numeral = {
init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContent) {
var unwrapped = ko.unwrap(valueAccessor()), allBindings = allBindingsAccessor();
var fmtVal = allBindings.get('fmt') || '0%';
$(element).html(numeral(unwrapped).format(fmtVal));
}
}
Ответы, представленные здесь, - это приятные трюки, но нокаут действительно имеет способ сделать это.
<td data-bind="numeral: {interest: interest, fmt: '0%' }">
и в вашей пользовательской привязке:
ko.bindingHandlers.numeral(fmt) = {
init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContent) {
var unwrapped = ko.utils.unwrapObservable(valueAccessor());
// unwrapped.interest... = interest
// unwrapped.fmt... = fmt ('0%' in this case)
}
}
Приветствия:)
Альтернативный вариант заключается в добавлении атрибута пользовательских данных в элемент, который требует дополнительного аргумента для привязки:
<td data-bind="numeral: interest" data-format="0%">
И затем внутри связывания вы можете извлечь значение атрибута из целевого элемента.
ko.bindingHandlers.numeral = {
init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContent) {
// ... some more code
var fmtVal = $(element).data("format") || '0%';
// ... do stuff with fmtVal
}}
Вы можете передать в качестве параметра для своей привязки объект. Что-то вроде:
<td data-bind="numeral: numeralOptions">
В вашей модели просмотра соответствующий объект:
numeralOptions = {
interest: ko.observable(808),
format: '0%'
}
Затем в пользовательской привязке, используя valueAccessor, вы можете получить доступ к любому начальному параметру, который вам нужен для вашей службы.
var myObject = valueAccessor();
myObject.interest();
myObject.format;
Вы могли бы что-то сделать, выполняя функцию или вычислив наблюдаемый вызываемый интерес, и если ее функция может принимать параметр. Тогда это будет иметь вид: data-bind = "numeral: interest ('0%')" Из этого вы могли бы затем написать обработчик привязки для выполнения js для вашей цели.