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 相关文章推荐
url 特殊字符 传递参数解决方法
Jan 01 Javascript
JQuery 在线引用及测试引用是否成功
Jun 24 Javascript
JavaScript闭包函数访问外部变量的方法
Aug 27 Javascript
angularJS 中input示例分享
Feb 09 Javascript
js实现下拉框选择要显示图片的方法
Feb 16 Javascript
JSON相关知识汇总
Jul 03 Javascript
JS组件Bootstrap Table表格行拖拽效果实现代码
Aug 27 Javascript
Highcharts学习之数据列
Aug 03 Javascript
JS根据生日月份和日期计算星座的简单实现方法
Nov 24 Javascript
ES6中Math对象的部分扩展
Feb 20 Javascript
jQuery实现简单的抽奖游戏
May 05 jQuery
浅析js中mvvm模式实现的原理
Oct 06 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
PHPShop存在多个安全漏洞
2006/10/09 PHP
打造计数器DIY三步曲(中)
2006/10/09 PHP
探讨如何在php168_cms中提取验证码
2013/06/08 PHP
php 在windows下配置虚拟目录的方法介绍
2013/06/26 PHP
php中的常用魔术方法总结
2013/08/02 PHP
Yii2中SqlDataProvider用法示例
2016/09/22 PHP
PHP钩子实现方法解析
2019/05/21 PHP
JavaScript 事件系统
2010/07/22 Javascript
JavaScript控制Session操作方法
2013/01/17 Javascript
node.js超时timeout详解
2014/11/26 Javascript
JS实现固定在右下角可展开收缩DIV层的方法
2015/02/13 Javascript
javascript中in运算符用法分析
2015/04/28 Javascript
jquery中添加属性和删除属性
2015/06/03 Javascript
javascript简单实现类似QQ头像弹出效果的方法
2015/08/03 Javascript
JS实现自动变换的菜单效果代码
2015/09/09 Javascript
js检测用户输入密码强度
2015/10/22 Javascript
几种tab切换详解
2017/02/03 Javascript
Vue验证码60秒倒计时功能简单实例代码
2018/06/22 Javascript
Python linecache.getline()读取文件中特定一行的脚本
2008/09/06 Python
Python科学画图代码分享
2017/11/29 Python
利用python实现微信头像加红色数字功能
2018/03/26 Python
使用python批量修改XML文件中图像的depth值
2020/07/22 Python
需要知道的CSS3动画技术
2010/01/01 HTML / CSS
HTML5混合开发二维码扫描以及调用本地摄像头
2017/12/27 HTML / CSS
一个精品风格的世界:Atterley
2019/05/01 全球购物
C语言变量的命名规则都有哪些
2013/12/27 面试题
人力资源部门的主要职能
2014/02/22 职场文书
80后职场人的职业生涯规划
2014/03/08 职场文书
销售会计岗位职责
2014/03/15 职场文书
大学生创业计划书
2014/08/14 职场文书
无财产离婚协议书范本
2014/10/28 职场文书
学校法制宣传日活动总结
2014/11/01 职场文书
单位介绍信格式范文
2015/05/04 职场文书
学校2016年全国助残日活动总结
2016/04/01 职场文书
vue实现简单数据双向绑定
2021/04/28 Vue.js
基于PyQT5制作一个桌面摸鱼工具
2022/02/15 Python