博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
封装第三方jquery插件
阅读量:5779 次
发布时间:2019-06-18

本文共 793 字,大约阅读时间需要 2 分钟。

需要自己编写 directives 的情况通常是当你使用了第三方的 jQuery 插件。因为插件在 AngularJS 之外对表单值进行更改,并不能即时反应到 Model 中。例如我们用得比较多的 jQueryUI  插件,当你选中一个日期后,插件会将日期字符串填到 input 输入框中。View 改变了,却并没有更新 Model,因为$('.datepicker').datepicker(); 这段代码不属于 AngularJS 的管理范围。我们需要编写一个directive 来让 DOM 的改变即时更新到 Model 里。

var directives = angular.module('directives', []); directives.directive('datepicker', function() {   return function(scope, element, attrs) {       element.datepicker({           inline: true,           dateFormat: 'dd.mm.yy',           onSelect: function(dateText) {               var modelPath = $(this).attr('ng-model');               putObject(modelPath, scope, dateText);               scope.$apply();           }       });   }});

然后在 HTML 中引入这个 directive

 <input type="text" datepicker ng-model="myObject.myDateValue" />

 

转载地址:http://exkyx.baihongyu.com/

你可能感兴趣的文章
又拍云沈志华:如何打造一款安全的App
查看>>
Nginx 学习书单整理
查看>>
克服大数据集群的挑战
查看>>
PostgreSQL并发控制(MVCC, 事务,事务隔离级别)
查看>>
12月19日一周一次【Python基础语法】
查看>>
DM***的第二阶段OSPF
查看>>
C# 列表 - List
查看>>
python socket编程
查看>>
20180702搭建青岛RAC记录
查看>>
安装部署TIDB分布式数据库
查看>>
Spring Security OAuth 实现OAuth 2.0 授权
查看>>
linux文件及简单命令学习
查看>>
dubbo源码分析-架构
查看>>
新 Terraform 提供商: Oracle OCI, Brightbox, RightScale
查看>>
6套毕业设计PPT模板拯救你的毕业答辩
查看>>
IT兄弟连 JavaWeb教程 JSP与Servlet的联系
查看>>
Windows phone 8 学习笔记
查看>>
linux并发连接数:Linux下高并发socket最大连接数所受的各种限制
查看>>
洛谷——P2176 [USACO14FEB]路障Roadblock
查看>>
我的友情链接
查看>>