angularJs中ng-model-options设置数据同步的方法


Posted in Javascript onSeptember 30, 2018

后台请求任务量很大的时候,可以设置同步的时间和操作,

利用ng-model-options来实现,提高网站性能。

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <script src="angular.min.js"></script>
</head>
<body>
<div ng-app="module" ng-controller="ctrl">
<!--updateOn:blur,鼠标离开时同步更新scope数据-->
<!--debounce:5000,数据输入完成后5秒,同步更新scope数据-->
  <input type="text" ng-model="title" ng-model-options="{updateOn:'default blur',debounce:{default:2000,blur:0}}">
  <!--ng-model-options="{updateOn:'default blur',debounce:{default:2000,blur:0}}
  输入光标离开,立即更新,若不离开,2秒后更新
-->
  {{title}}
</div>
<script>
  var m = angular.module('module', []);
  m.controller('ctrl', ['$scope', function ($scope) {
  }]);
</script>
</body>
</html>

以上这篇angularJs中ng-model-options设置数据同步的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于Jquery的回车成tab焦点切换效果代码(Enter To Tab )
Nov 14 Javascript
读jQuery之七 判断点击了鼠标哪个键的代码
Jun 21 Javascript
jquery实现上下左右滑动的方法
Feb 09 Javascript
javascript实现动态导入js与css等静态资源文件的方法
Jul 25 Javascript
json+jQuery实现的无限级树形菜单效果代码
Aug 27 Javascript
Bootstrap每天必学之表格
Nov 23 Javascript
深入理解ECMAScript的几个关键语句
Jun 01 Javascript
javascript正则表达式中分组详解
Jul 17 Javascript
jQuery表单验证插件解析(推荐)
Jul 21 Javascript
JS绘制微信小程序画布时钟
Dec 24 Javascript
webpack 最佳配置指北(推荐)
Jan 07 Javascript
JS+canvas五子棋人机对战实现步骤详解
Jun 04 Javascript
vue-cli 脚手架基于Nightwatch的端到端测试环境的过程
Sep 30 #Javascript
对angularJs中ng-style动态改变样式的实例讲解
Sep 30 #Javascript
使用angularjs.foreach时return的问题解决
Sep 30 #Javascript
angular将html代码输出为内容的实例
Sep 30 #Javascript
详解Vue.js iview实现树形权限表(可扩展表)
Sep 30 #Javascript
对angularJs中$sce服务安全显示html文本的实例
Sep 30 #Javascript
vue  自定义组件实现通讯录功能
Sep 30 #Javascript
You might like
PHP4 与 MySQL 交互使用
2006/10/09 PHP
php与flash as3 socket通信传送文件实现代码
2014/08/16 PHP
php使用scandir()函数扫描指定目录下所有文件示例
2019/06/08 PHP
[原创]静态页面也可以实现预览 列表不同的显示方式
2006/10/14 Javascript
php对mongodb的扩展(初识如故)
2012/11/11 Javascript
用js来获取上传的文件名纯粹是为了美化而用
2013/10/23 Javascript
调试代码导致IE出错的避免方法
2014/04/04 Javascript
Javascript毫秒数用法实例
2015/02/05 Javascript
innerHTML中标签可以换行的方法汇总
2015/08/14 Javascript
jQuery插件EasyUI设置datagrid的checkbox为禁用状态的方法
2016/08/05 Javascript
利用JS实现简单的日期选择插件
2017/01/23 Javascript
Vue.js原理分析之observer模块详解
2017/02/17 Javascript
Angular2开发——组件规划篇
2017/03/28 Javascript
详解webpack3如何正确引用并使用jQuery库
2017/08/26 jQuery
JavaScript实现小球沿正弦曲线运动
2020/09/07 Javascript
layui自定义插件citySelect实现省市区三级联动选择
2019/07/26 Javascript
浅谈vue异步数据影响页面渲染
2019/10/29 Javascript
JavaScript常用工具函数大全
2020/05/06 Javascript
python使用paramiko模块实现ssh远程登陆上传文件并执行
2014/01/27 Python
在Django的模型中执行原始SQL查询的方法
2015/07/21 Python
Django中Model的使用方法教程
2018/03/07 Python
django admin 后台实现三级联动的示例代码
2018/06/22 Python
Python 实现Serial 与STM32J进行串口通讯
2019/12/18 Python
如何在python开发工具PyCharm中搭建QtPy环境(教程详解)
2020/02/04 Python
python如何快速生成时间戳
2020/07/21 Python
Python基于gevent实现文件字符串查找器
2020/08/11 Python
如何在python中处理配置文件代码实例
2020/09/27 Python
CSS3毛玻璃效果(blur)有白边问题的解决方法
2016/11/15 HTML / CSS
阿玛尼化妆品美国官网:Giorgio Armani Beauty
2017/02/02 全球购物
澳洲小众品牌的集合网站:BNKR
2018/02/23 全球购物
大学生自我评价范文分享
2014/02/21 职场文书
员工安全生产承诺书
2014/05/22 职场文书
门店业绩提升方案
2014/06/08 职场文书
大学毕业典礼演讲稿
2014/09/09 职场文书
无犯罪记录证明范本
2014/09/15 职场文书
Nginx配置之禁止指定IP访问
2022/05/02 Servers