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 相关文章推荐
详解JS函数重载
Dec 04 Javascript
javascript实现Table排序的方法
May 15 Javascript
jQuery移动web开发之页面跳转和加载外部页面的实现
Dec 04 Javascript
jQuery EasyUI API 中文帮助文档和扩展实例
Aug 01 Javascript
Vue.js学习教程之列表渲染详解
May 17 Javascript
纯js实现隔行变色效果
Nov 29 Javascript
Chart.js 轻量级HTML5图表绘制工具库(知识整理)
May 22 Javascript
JavaScript格式化json和xml的方法示例
Jan 22 Javascript
Angular7中创建组件/自定义指令/管道的方法实例详解
Apr 02 Javascript
解决vue跨域axios异步通信问题
Apr 17 Javascript
React+Redux实现简单的待办事项列表ToDoList
Sep 29 Javascript
vue监听滚动事件的方法
Dec 21 Vue.js
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
PHP.ini中配置屏蔽错误信息显示和保存错误日志的例子
2014/05/12 PHP
php pthreads多线程的安装与使用
2016/01/19 PHP
弹出模态框modal的实现方法及实例
2017/09/19 PHP
PHP基于curl实现模拟微信浏览器打开微信链接的方法示例
2019/02/15 PHP
Yii2.0框架模型添加/修改/删除数据操作示例
2019/07/18 PHP
javascript 数组的方法集合
2008/06/05 Javascript
jQuery创建插件的代码分析
2011/04/14 Javascript
将数字转换成大写的人民币表达式的js函数
2014/09/21 Javascript
jQuery实现带滚动导航效果的全屏滚动相册实例
2015/06/19 Javascript
基于Jquery实现万圣节快乐特效
2015/11/01 Javascript
jQuery插件编写步骤详解
2016/06/03 Javascript
jQuery模拟select实现下拉菜单功能
2016/06/20 Javascript
微信小程序使用第三方库Immutable.js实例详解
2016/09/27 Javascript
11个Javascript小技巧帮你提升代码质量(小结)
2020/12/28 Javascript
python 正则表达式 概述及常用字符
2009/05/04 Python
在Python的Flask框架中实现全文搜索功能
2015/04/20 Python
Python 爬虫爬取指定博客的所有文章
2016/02/17 Python
Python实现感知机(PLA)算法
2017/12/20 Python
TensorFlow的权值更新方法
2018/06/14 Python
啥是佩奇?使用Python自动绘画小猪佩奇的代码实例
2019/02/20 Python
浅析Python 引号、注释、字符串
2019/07/25 Python
OpenCV+Python3.5 简易手势识别的实现
2020/12/21 Python
html5实现图片转圈的动画效果——让页面动起来
2017/10/16 HTML / CSS
TOWER London官网:鞋子、靴子、运动鞋等
2019/07/14 全球购物
一套C#面试题
2013/10/09 面试题
几个常见的消息中间件(MOM)
2014/01/08 面试题
自荐信的格式
2014/03/10 职场文书
三八妇女节趣味活动方案
2014/08/23 职场文书
会议营销主持词
2015/07/03 职场文书
2015年街道办事处团委工作总结
2015/10/14 职场文书
基于flask实现五子棋小游戏
2021/05/25 Python
雄兵连:第三季先行图公开,天使恶魔联合,银河之力的新力量
2021/06/11 国漫
使用Postman测试需要授权的接口问题
2022/06/21 Java/Android
Android移动应用开发指南之六种布局详解
2022/09/23 Java/Android
css清除浮动clearfix:after的用法详解(附完整代码)
2023/05/21 HTML / CSS