使用 Knockout-ES5 时如何访问自定义绑定中的可观察量

2024-01-04

如果模型属性是 ko.observable(),则可以在自定义绑定中按如下方式访问这些属性。

var observable = valueAccessor();

使用 Knockout-ES5 插件时,如何在自定义绑定中获取可观察值?检查下面的代码并查找注释“如何在此处获取 propertyName?”

不使用 Knockout-ES 插件时的 JS Fiddle http://jsfiddle.net/rniemeyer/X82aC/礼貌地再看看 KnockoutJS 的自定义绑定 http://www.knockmeout.net/2011/07/another-look-at-custom-bindings-for.html

更新了模型的小提琴,更改为使用 Knockout-ES 插件 http://jsfiddle.net/xb6vR/

ko.bindingHandlers.datepicker = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
        //initialize datepicker with some optional options
        var options = allBindingsAccessor().datepickerOptions || {};
        $(element).datepicker(options);

        //handle the field changing
        ko.utils.registerEventHandler(element, "change", function () {
            var observable = valueAccessor();
            if (!ko.isObservable(observable)) {                
                console.log("Not Observable");
                //How to get propertyName here?
                //ko.getObservable(viewModel, 'propertyName');
                return;
            }
            observable($(element).datepicker("getDate"));
        });

        //handle disposal (if KO removes by the template binding)
        ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
            $(element).datepicker("destroy");
        });

    },
    //update the control when the view model changes
    update: function(element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor()),
            current = $(element).datepicker("getDate");

        if (value - current !== 0) {
            $(element).datepicker("setDate", value);   
        }
    }
};

var viewModel = {
    myDate: new Date("11/01/2011"),
    setToCurrentDate: function() {
       this.myDate = new Date();   
    }
};

ko.track(viewModel);

ko.applyBindings(viewModel);

您可以将实际的可观察值传递给绑定:

data-bind="datepicker: ko.getObservable($data, 'myDate') ..."

http://jsfiddle.net/xb6vR/1/ http://jsfiddle.net/xb6vR/1/

但这很难看。幸运的是,Knockout 确实提供了一种从绑定写入属性值的方法(未记录):

//handle the field changing
ko.utils.registerEventHandler(element, "change", function () {
    var writable = valueAccessor();
    if (!ko.isObservable(writable)) {                
        var propWriters = allBindingsAccessor()._ko_property_writers;
        if (propWriters && propWriters.datepicker) {
            writable = propWriters.datepicker;
        } else {
            return;
        }
    }
    writable($(element).datepicker("getDate"));
});

http://jsfiddle.net/xb6vR/3/ http://jsfiddle.net/xb6vR/3/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 Knockout-ES5 时如何访问自定义绑定中的可观察量 的相关文章

  • KnockoutJS - 打印迭代索引作为输入名称

    我正在尝试结合 Spring MVC 创建我的第一个 KnockoutJS 表单视图 ModelAttribute捆绑 数据通过 Ajax 加载并使用 KnockoutJS 填充 通过 KnockoutJS 添加数据 通过 Ajax 和 K
  • 使用knockout js实现html5拖放照片,durandal 2.0

    我在淘汰赛 js 视图模型中有一个照片列表 我希望能够在它们之间交换 实际上更正确的术语是将一张复制到另一张上面 这是我的简化视图模型 define durandal app knockout jquery function app ko
  • 使用 knockout.js 防止双击按钮

    禁用按钮以便 Knockout js 不会发生双击的最佳方法是什么 我有一些用户快速点击导致多个 ajax 请求 我认为 knockout js 可以通过多种方式处理这个问题 并希望看到一些替代方案 使用信号量 旋转锁 基本上 您计算一个元
  • Knockout 将 css 类绑定到观察到的模型属性

    我想将 divs css 类绑定到视图模型的属性 如下所示 div 但这会产生结果 div class 0 1 2 3 这是视图模型 myViewModel selectedPriority ko observable High Compa
  • Edge 中的 Javascript 仅适用于打开的 devtools

    我遇到的问题是 在 MS Edge 中 我的图像映射功能只能部分工作 它由淘汰赛 FW 提供动力 在更大的图像映射上 它不会将整个图像映射注册到视图模型中 因此 图像映射的所有悬停效果和单击样式都会停止工作 然而 这只是大图像地图的问题 还
  • Knockout.js——理解 foreach 和 with

    我一直在阅读 learn knockout js 教程并进行实验 有人可以解释为什么这有效吗 教程 单页应用程序 步骤 2 使用with chosenFolderData and foreach mails table class mail
  • 如何使用 URL 将数据从 javascript 发送到 ASP.NET MVC 控制器

    我需要一些帮助 我使用 ASP NET MVC4 以及 JavaScript 和 Knockout 编写了一个小应用程序 但我无法将数据从 javascript 发送到 MVC 控制器 反之亦然 例如JS部分是这样的 JavaScript
  • 淘汰赛“闪烁”问题

    我正在使用 KO 构建 SPA 单页应用程序 该应用程序看起来像一本书 用户可以翻页 问题是 每次加载页面时 都会有一小段时间页面 闪烁 用户会看到页面的无样式版本 我猜这是因为很多样式都依赖于 ko 绑定 所以在 ko 完成它 神奇 之前
  • 如何在淘汰赛模板中控制日志

    我认为这是正确的 div div
  • 对模板之一的 observableArray 进行排序

    我有以下视图模型 function instance id FirstName extend this id ko observable id FirstName ko observable FirstName 我在 observableA
  • knockout valueUpdate 无法与 Pagedown 一起使用?

    我的看法有以下几点
  • knockoutjs 在 foreach 绑定中单击绑定

    编辑 问题与绑定无关 而是与一个简单的 JavaScript 错误有关 我有一个关于 foreach 绑定中的单击绑定的问题 我有一个列表 其中的项目显示一个下拉框 用于从主数据中选择一个值 可以在该列表中添加和删除项目 用于删除项目的按钮
  • MVVM 在 ASP.NET MVC 4 Web 应用程序中扮演什么角色?

    当我正在阅读 ASP NET MVC 4 这本书时 我对 MVVM 感到好奇 我开始谷歌搜索 找不到任何关于使用 MVVM 开发 Web 应用程序的书籍 所以我一定在这里遗漏了一些信息 据我了解 MVVM是通过knockout js和其他框
  • 使用 KnockoutJS 映射插件执行部分更新

    现在 我将这个 JSON 与 KO 映射插件一起使用 并且工作正常 Controls Fields Name emailField Text email Visible true Name hiddenField Text text Vis
  • Breeze.js 查询不更新淘汰赛视图

    我正在通过 Breeze js 查询数据 第一次运行良好 第二次视图未更新 html a Order by Newest a a Order by Score a div ul li strong span span strong span
  • 如何使用离线存储和 Knockout.js 实现 MVVM?

    我可以使用 Knockout js 实现 Mvvm 但我想将它与跨浏览器 FF 和 Chrome 支持的 Html 5 离线存储一起使用 我想将 html 对象绑定到离线存储 我没试过 但是有一个knockout localStorage
  • 将某些 observableArray 对象属性转换为 observable

    假设我有这个相同类型对象的数组 var people status 0 name name1 status 1 name name2 我不仅希望它是 observableArray 而且我只想观察每个对象的状态属性 想象一下对象本身可能会被
  • 淘汰foreach绑定无序列表

    首先 圣诞快乐 希望圣诞节那天没有其他人在工作 除非他们是出色的专家并且真的很想帮助我 我正在使用神话般的jQuery 列导航插件 http code google com p jquery column navigation 以多列方式向
  • 首选的客户端路由解决方案? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 带有淘汰赛js的隐形recaptcha

    我正在完成隐形验证码 但我在实现它时遇到问题 谷歌开发人员页面中的代码显示它应该是这样的

随机推荐

  • QToolTip 中包含的变量不会自动更新

    我在 QLineEdit 上有一个 QToolTip 并且工具提示包含文本中的变量 工具提示代码包含在 init h 文件中 问题是工具提示中的变量值在程序运行中发生更改时不会自动更新 例如 我将鼠标悬停在行编辑上 值会显示在工具提示中 我
  • 在 JavaScript 中为属性添加别名

    我认为这很简单 有没有一种简单的方法来添加属性的辅助名称 我认为这是特定于字符串的 我不确定 即 c length this line pseudo code hello world length returns 11 hello worl
  • Scala Slick 2 加入多个字段?

    如何在多个字段上进行连接 如下例所示 val ownerId 1 val contactType 1 val contact for t c lt ContactTypes leftJoin Contacts on id typeId ow
  • XCode 4 与 Git/Github 无法提交图像

    源代码文件已提交 但图像未提交 错误信息 错误 pathscpec 与 git 已知的任何文件都不匹配 XCode 发行说明提到现在提交二进制文件存在问题 他们建议 在收到该错误后 您应该转到命令行并执行 git commit
  • JavaScript同步执行

    我是 javascript 新手 正在尝试使用滑块 我的问题类似于以下问题jquery attr 带回调 https stackoverflow com questions 4040712 jquery attr with callback
  • 在 Azure SQL DB 中启用和配置 FILESTREAM

    如何在 AZURE SQL DB 中存储 PDF 文件 上述要求我在 Azure SQL DB 上启用和配置 FILESTREAM 目前 当我运行创建表查询时出现此错误 Msg 40517 Level 16 State 1 Line 28
  • 数据列表分页?

    我有一个包含动态内容的数据列表 我需要启用对此数据列表的分页 我在 Visual Studion 2010 下使用 asp net c 请向我发送如何启用对数据列表分页的代码 这是数据列表的代码
  • 第一次偶然异常发生在 XMLSerializer 的构造函数中[重复]

    这个问题在这里已经有答案了 可能的重复 XmlSerializer 在构造函数中给出 FileNotFoundException https stackoverflow com questions 1127431 xmlserializer
  • Github - 分叉一个私人仓库

    我已被添加到一个拥有一些私有存储库的组织 我需要向他们发送包含一些更改的拉取请求 但我不知道是否可以 我在 GitHub 上没有付费帐户 那么如何分叉该私有存储库来修改和发送拉取请求 正如 如果我将其他人的私人 Github 存储库分叉到我
  • “VkVertexInputBindingDescription”中“绑定”的目的是什么?

    https www khronos org registry vulkan specs 1 0 man html VkVertexInputBindingDescription html https www khronos org regi
  • 记录 WCF 消息大小

    我正在使用 WCF 通过网络发送一些 Linq 对象 我想使用消息日志记录或跟踪来记录消息大小 然而我不想 或者没有能力使用配置文件来设置它 我正在努力弄清楚如何以编程方式执行此操作 我不在乎这是否发生在客户端主机上 我控制两者 有人有这样
  • Perl Cwd::cwd 和 Cwd::getcwd 函数有何不同?

    问题 有什么区别Cwd cwd and Cwd getcwd一般来说 在 Perl 中 不考虑任何特定平台 为什么 Perl 两者兼而有之 预期用途是什么 在什么场景下应该使用哪一种 我们将不胜感激示例用例 这重要吗 假设我不混合它们 选择
  • 安全 Rust 中可能存在未定义行为吗?

    有没有什么方法可以在不使用 Rust 的情况下实现未定义的行为unsafe 当然 此类行为可以由第三方库包装在 安全 函数中 因此我们假设我们仅使用标准函数 绝对可以 但是任何此类情况都是 Rust 或标准库的错误 https github
  • 如何获取列表中列表的索引?

    list word1 word2 word3 print list index word1 这很好用 但我如何获得这个的索引 list word1 word2 word3 word4 word5 word6 print list index
  • 重新启动auditd服务会出现依赖错误

    我正在尝试为 docker 守护进程配置审核 如下所示 将下面的行添加到 etc audit audit rules file w usr bin dockerd k docker 然后 使用以下命令重新启动审核守护程序 service a
  • 使用 IB 调整大小构建自定义 UITableViewCell?

    我已确保单元格的自动调整大小蒙版允许灵活的宽度 但当设备旋转时 单元格的大小不会调整 我还验证了表格视图已调整大小 问题直接出在单元格上 这是我用来创建单元格的代码 if cell nil Load the top level object
  • 带系统函数的 C 程序中的大括号扩展

    我尝试了命令 cat tmp file 1 3 gt newFile 并且工作完美 但是当我编译并执行以下c程序时 include
  • 在最新的 Ember 中,如何仅使用模型的 id/名称链接到路由,而不是在链接页面中提供其所有属性?

    从 Ember 1 0 pre2 转换到最新的 master 时我遇到了问题 43354a98 https github com emberjs ember js commit 43354a98a5e441095132b1407f3e1f4
  • 在 React Native 中导入图形工具包会导致错误 500

    我正在使用最新版本的Expo 我创建了一个项目expo init my project并添加了React Native 图表套件 https github com indiespirit react native chart kit 这是p
  • 使用 Knockout-ES5 时如何访问自定义绑定中的可观察量

    如果模型属性是 ko observable 则可以在自定义绑定中按如下方式访问这些属性 var observable valueAccessor 使用 Knockout ES5 插件时 如何在自定义绑定中获取可观察值 检查下面的代码并查找注