如何创建使用 ng-model 的角度日期选择器指令

2024-03-28

我为 jQuery UI 日期选择器创建了一个角度指令。问题是,当选择日期时,指令不会更新输入的 ng-model。知道为什么吗?

http://jsbin.com/ufoqan/1/edit http://jsbin.com/ufoqan/1/edit


AngularJS 实际上提供了一个特殊的控制器来与ngModel您可以在指令中使用它;只需添加require: 'ngModel'到你的指令定义。

这为您提供了第四个参数link函数,这是您在中要求的控制器require--在本例中,是一个实例of ngModelController http://docs.angularjs.org/api/ng.directive%3angModel.NgModelController。它有一个方法叫做$setViewValue您可以使用设置模型的值:

app.directive('datepicker', function() {
  return {
    require: 'ngModel',
    link: function(scope, el, attr, ngModel) {
      $(el).datepicker({
        onSelect: function(dateText) {
          scope.$apply(function() {
            ngModel.$setViewValue(dateText);
          });
        }
      });
    }
  };
});

美丽的事情是关于ngModelController它会自动处理验证和格式化(在特定输入的情况下)type)以及与诸如此类的集成ngChange回调;查看这个例子 http://jsbin.com/ufoqan/6/edit: http://jsbin.com/ufoqan/6/edit http://jsbin.com/ufoqan/6/edit

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

如何创建使用 ng-model 的角度日期选择器指令 的相关文章

  • Angular JS 更改后更新输入字段

    我正在尝试在 Angular 中构建一个简单的计算器 如果我愿意的话 我可以在其中覆盖总数 我有这部分工作 但是当我返回在字段一或字段二中输入数字时 字段中的总数不会更新 这是我的jsfiddlehttp jsfiddle net YUza
  • 如何使用 JqGrid 子网格进行内联编辑?

    我知道如何使用主网格进行内联编辑 但是有没有办法对子网格进行内联编辑 这是我的 JS 文件 function var lastsel list jqGrid url example php postData q 1 datatype jso
  • triggerHandler 导致错误:[$rootScope:inprog] $apply 已进行中错误 - AngularJS

    我试图在按下某个键时触发按钮的单击 我正在使用triggerHandler函数 但这导致了上述错误 我想我一定创建了某种循环引用 循环 但我看不到在哪里 这是我的 HTML
  • npm 脚本:node-sass 不监视部分 sass 文件

    我有这个项目结构 src assets css sass main scss variables scss 我正在尝试编写一个 npm 脚本 该脚本将监视我的所有 scss 文件 包括部分文件 中的更改 然后仅编译我的 main scss
  • Jquery 动画与 CSS 浮动

    我的代码有问题 宽度似乎可以工作 但浮动没有 这里是 这是一个例子 http jsfiddle net v82ck http jsfiddle net v82ck 问题 悬停时菜单上的浮动属性不会改变 我希望每个菜单元素下方的线在悬停该菜单
  • Angularjs 在生产中禁用调试数据

    我正在尝试按照角度文档中的建议禁用生产服务器中的调试数据here https docs angularjs org guide production 补充一点 我并没有真正看到性能和加载时间有任何改进 这是我的代码在 app js 中的样子
  • KineticJS - 将舞台缩放到视口

    我正在努力将默认分辨率设置为 1366x756 我会根据视口来放大和缩小它 类似于此处显示的示例 http blogs msdn com b davrous archive 2012 04 06 modernizing your html5
  • 嵌套对象的 AJV 模式验证

    函数返回的对象看起来像这样 answer vehicle type 1 message Car model VW color red 答案 对象始终存在 其他字段基于 vehicle type E g 如果vehicle type 1 则有
  • 获取键盘事件中的鼠标位置

    我试图在用户按住 Shift 键时出现选择轮 滚轮应以鼠标位置为中心 然而当我测试这个时 pageX and clientX两者在事件对象上都未定义 是否可以通过键盘事件获取鼠标坐标 不 只需跟踪mousemove事件并持续保存当前位置 以
  • 当脚本是从加载的脚本动态创建的 DOM 节点时,脚本 onload 和 window.onload 的顺序是否定义良好?

    File loader js function main if typeof window undefined var script window document createElement script script src https
  • HTML if 语句在 CDN 失败时加载本地 JS/CSS

    当从 CDN 或任何外部服务器加载 CSS JS 文件时 有可能 即使概率很低 由于外部故障而丢失该文件 在这种情况下 html 页面将因缺乏适当的 CSS 和 JS 而被损坏 有没有一种实用的方法可以在 CDN 故障时加载本地版本 IF
  • 如何在流程图中间隔刻度线?

    我下面有一个流程图 您将看到标签被压缩 我想使刻度之间的宽度确保显示所有标签 标记如下 div div class graph info a href span span a a href class active span span a
  • 检查 href 中是否存在 jQuery 中的查询字符串

    我目前有一段 jQuery 用于附加带有一些位置信息的 URL jQuery a attr href function return this href location 123 abc 我的问题是大多数链接都有一个 其中使用上面的 就可以
  • AngularUI Router:在调用子状态时将 url 参数传递给“抽象”状态

    我想在调用子状态时访问抽象状态内的 url 参数 stateParam 我很想知道如何做到这一点 代码在笨蛋也 http plnkr co edit L0TXx3DCBOJmh4XydXbV p preview stateProvider
  • 单击窗口后才检测到 keydown

    在我的 Web 应用程序中 我有一个用于打开菜单的键的事件侦听器 仅当我单击页面上的任意位置后 此功能才可以正常工作 我尝试将焦点添加到窗口加载 但这仍然不会让 keydown 函数运行 直到我单击页面上的某个位置之后 有谁知道这是否可能
  • 用于客户端存储和服务器端同步的javascript库[关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在寻找一个 javascript 库 它可以让我将数据存储在客户端数据库中 并在后台自动将数据库同
  • CKEditor TypeError:c[a] 在 CodeIgniter 中未定义

    我正在尝试在基于 codeigniter 的网站中安装 CKEditor 并且我已按照本教程进行操作 Codeigniter 教程中的 CKEditor http nukium com developpement php framework
  • 如何逐步绘制矢量路径? (拉斐尔.js)

    如何逐步动画化矢量路径 就像它被绘制一样 换句话说 慢慢地逐像素地显示路径 我在用着Rapha l js but如果您的答案不是特定于库的 例如可能有一些通用的编程模式可以完成此类事情 我对矢量动画相当陌生 欢迎 使用直线路径很容易做到 就
  • JS中如何过滤多个字符串? [复制]

    这个问题在这里已经有答案了 我希望能够过滤数组中的多个字符串 类型 例如我想过滤类型meat并输入fruit在下面的数据结构中 我想要实现的是过滤数据对象 const data type meat food hamburger type f
  • JavaScript 右移负数

    这是片段 var i 101 console log 101 i toString 2 console log 101 gt gt 1 i gt gt 1 toString 2 var l 101 console log 101 l toS

随机推荐

  • 如何在张量流中找到已识别对象的位置(ROI)

    我使用的是tensorflow android示例 它有一个用于ROI位置的占位符 参见tensorflow examples android src Classifier java 但它没有被使用 我希望能够找到分类对象的投资回报率 我查
  • Selenium 失败并显示空异常消息

    我使用 Selenium 2 7 0 和 Python 2 6 我的操作系统是 Mac OS X 10 7 当我尝试实例化 webdriver 对象时 我收到以下消息 selenium common exception WebDriverE
  • 路由错误 没有路由匹配 [PATCH]“/locations”

    我在尝试更新位置项后收到路线错误 我正在使用 before action 来设置位置 id before action set location only show edit update destroy private def set l
  • 显示具有单个 ID 的多条通知消息

    我有几个同时发生的事件 我需要以串行方式向用户显示多条通知消息 理想的情况是 每条通知消息将轮流显示 持续时间约为 2 秒 我能得到的最接近的是使用多个 id 但是 使用多个 id 会产生我不想要的副作用 最终状态栏上会同时显示多条通知消息
  • 如何在退出时杀死所有子进程?

    当node js进程退出时 如何杀死所有子进程 使用child process spawn生成 我认为唯一的方法是保留对ChildProcess返回的对象spawn 并在退出 master 进程时杀死它 一个小例子 var spawn re
  • 如何动态选择要在 Jenkins 构建中使用的 git 分支

    我正在尝试为 Jenkins 构建服务器创建一个新的项目配置 为了简化我想要做的事情 我将仅使用两个组件来描述问题 组分A 该组件的更改会触发该项目在 CI 服务器上的构建 CI 服务器具有静态配置的分支来监视更改和构建 例如 掌握或开发分
  • x86 中不同数学函数的性能?

    我正在编写 3D 碰撞 想知道基本数学函数 如 sqrt pwr 三角函数 如 sin cos tan arcsin 的性能差异 我听说这取决于许多其他因素 所以我只是想粗略地了解哪一个速度较慢并且需要避免 同时寻找不同的方法来解决问题 我
  • 如何在实体框架中使用数据库优先方法来使用存储库模式

    如何在实体框架中使用数据库优先方法来使用存储库模式 我在浏览互联网上可用的资源时得到了一些想法 但对于实时应用程序 我不确定如何在从数据库优先方法自动生成的类上实现存储库模式 我已经浏览过 SO 中的一些链接 但我没有得到任何明确的想法 我
  • Node.js fs.unlink 函数导致 EPERM 错误

    我在用着fs unlink 删除文件 我收到以下错误 uncaught undefined Error EPERM Operation not permitted Path To File 有人知道为什么会发生这种情况吗 您无法删除不为空的
  • DynamoDB:如何使用查询过滤器检查 MAP 中的条件

    我有一张表 结构如下 当我进行查询时 我希望能够对数据图进行查询过滤 但我不太确定如何设置查询 这是我到目前为止所拥有的 HashMap
  • 如何通过 ASP.NET Core/Razor 单击按钮来运行在 Razor 页面上编写的 C#?

    我想在单击页面上的按钮时执行我直接在 razor 页面上编写的 C 方法 我发现 如果我引用了页面上的按钮 它会在第一次加载时执行该方法 但当我实际单击该按钮时 它不会再次执行 这是代码 Razor 页面 C 参考 functions in
  • Go 1.13 RSS持续增加,疑似清理问题

    我们的一项 Go 服务中的 RSS 不断增加 我们怀疑这是由于 scavenger 没有正确地将内存返回给操作系统 或者操作系统由于使用 MADV FREE 而没有收回内存 通过 pprof 检查 未检测到内存泄漏 我们尝试使用以下简单的
  • Facebook API - 无法获取页面个人资料图像

    我有一个页面无法从中获取公共个人资料图像 为什么会这样 为什么会发生 有问题的页面是 警告 脱衣舞娘的 NSFW 风格图像 真的很抱歉 我只能找到示例 无论如何都不需要查看该页面 https www facebook com pages T
  • Java Applet 不缓存

    我部署的 Java 小程序有问题 该小程序拒绝缓存在 jvm 的 粘性 缓存 或浏览器 中 由于某种原因 每次用户加载该小程序所在的页面时 jvm 都会从服务器重新下载 jar 文件 这会导致长时间延迟 包含该小程序的网页是通过互联网访问的
  • 如何在 Windows 机器上构建或安装 freeglut

    我下载了freeglut http freeglut sourceforge net 我正在阅读安装指示 http freeglut sourceforge net docs install php 我提取了所有文件 我看到一个名为conf
  • 无服务器框架Python lambda直接返回JSON

    我试图找出如何使用无服务器框架直接以 JSON 形式返回响应 这是 AWS 上具有 Lambda 代理集成的功能 全部默认设置 目标是从 python lambda 函数中 HTTP 响应客户端直接获取的是 JSON 对象 而不是 JSON
  • 在javascript中访问数组中的数组

    我收到一个 JSON 回复 如下所示 order id 12 customer user user status Pending date added 02 09 2012 total 500 00 action text View hre
  • 如何使用回调来保证顺序执行?

    我正在尝试围绕回调进行思考 但我不明白回调是如何进行的保证将执行一条语句之后 就时间而言 另一个声明需要一个unknown多少时间 我不在乎承诺 等待 异步等但只是我想学习的简单回调 例如下面的例子 我的方法将在未知时间事件发生之前执行回调
  • 从网页中的 servlet 读取 Quicktime 电影?

    我有一个 Servlet 它通过从服务器读取文件来构造对媒体文件请求的响应 File uploadFile new File C TEMP movie mov FileInputStream in new FileInputStream u
  • 如何创建使用 ng-model 的角度日期选择器指令

    我为 jQuery UI 日期选择器创建了一个角度指令 问题是 当选择日期时 指令不会更新输入的 ng model 知道为什么吗 http jsbin com ufoqan 1 edit http jsbin com ufoqan 1 ed