javascript - Knockout 附加 observables w/characters

标签 javascript jquery knockout.js knockout-2.0

我的 KnockoutJS 应用程序中有可观察对象,它们的值是从应用程序中全局包含的数组中获取的,例如:

self.observable = ko.observable(App[0].Observable_Value);

为方便起见,假设 Observable_Value = 10。

这正如您所期望的那样工作并且 <input>默认情况下,self.observable 绑定(bind)到的值具有正确的值; 10.

我现在想做的是在 <input> 中附加带有 % 的 observable。因此输入字段中显示的输出将为 10%。

我只是想在输入值后附加一个 %,因为我需要 observable 以数字形式可读,不是字符串以防止稍后出现 NaN 错误应用程序。该应用严重依赖数字。

我已经尝试将此作为具有读/写和 parseFloat 的计算函数来执行此操作,但没有成功。

有什么想法吗?

最佳答案

我认为在这种情况下最好的选择是 custom binding handler .

I simply want to append the input value with a % because I need the observable to be readable as a number and not a string

这正是绑定(bind)处理程序可以做的——保留可观察对象的原始值,但改变它的显示方式。

I've tried doing this as a computed function

虽然计算函数可以解决这个问题,但它通常是不必要的,除非您想实际使用计算函数的返回值。在这种情况下,由于您只想更改视觉显示,因此不需要另一个表示相同值的变量。

这是一个非常的基本方法,它只是在可观察值的前面放置了一个% 符号。 See fiddle

ko.bindingHandlers.percent = {
    init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
        var value = ko.unwrap(valueAccessor());
        $(element).text('%' + value);
    }
};

关于javascript - Knockout 附加 observables w/characters,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23161188/

相关文章:

javascript - 将 HTML 添加到自定义运输承运商/方法

javascript - 正确重叠路径上的结束标记

javascript - View 模型外的 Knockout.js 调用方法

javascript - knockout 映射 - 来自 JS - 一个简单的例子失败

asp.net-mvc-4 - 从 Knockout JS View 和 viewModel 创建 pdf

javascript - 如何在 Jquery Selector 中使用 c# ViewBag 变量?

javascript - 使用 JavaScript 检测复选框更改时的奇怪行为

php - 转义 mysql 搜索字符串 php

javascript - 选择单选输入时如何更改按钮颜色,但输入包装在标签之前的 div 中?

javascript - 输入标签,如何在事件中将数字重置为1