在angularjs中使用debounce延迟代码

2024-03-04

我必须在 AngularJS 中编写电子邮件验证功能。当用户使用电子邮件 ID 完成编辑后,我想在 2 秒后发出发布请求。 AngularJS 中有没有为此预先定义的方法。fiddle http://jsfiddle.net/Qdk5M/1944/

var app = angular.module('form-example', []);
    app.controller('formctrl',function($scope){
        var ctrl= this;
        ctrl.verifyEmail= function(){    
        console.log('hiiii')
        }

    })

您可以使用ng-模型选项 https://docs.angularjs.org/api/ng/directive/ngModelOptions#debouncing-updates延迟模型更新。这是一个工作示例。该功能是在 Angular 1.4+ 中添加的。

var app = angular.module("myApp", []); 
app.controller("myCtrl", function($scope) {
    
});
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<script>

</script>

<div ng-app="myApp" ng-controller="myCtrl">
  <input ng-model="email" ng-model-options="{ debounce: 2000 }"/>
  <br/><br/>
  The email will be updated here after 2 seconds: <strong>{{email}}</strong>
</div>

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

在angularjs中使用debounce延迟代码 的相关文章

随机推荐

  • 设置 android:windowSoftInputMode="adjustPan" 时如何滚动布局?

    我的活动有一个顶部栏和一个底部栏 顶栏和底栏之间的空间我有一个线性布局 里面有几个编辑文本视图 因为我不希望每次软键盘出现时都调整布局大小 所以我在清单中为我的活动设置了 android windowSoftInputMode adjust
  • 如何禁用 Ext JS 按钮

    我有一个 id 为的按钮btnAdd我想在某些事件触发时禁用它 当某些窗口关闭时该事件发生 所以我尝试了下面的代码 但它不起作用 Ext create Ext window Window Some initialization code g
  • Swift:无法读取数据,因为它的格式不正确

    我尝试使用 Alamofire 调用 POST Api 但它向我显示格式不正确的错误 这是我的 JSON 响应 source nome LOTERIAS BELEM endereco R DO COMERCIO 279 uf AL cida
  • python 组/用户管理包

    我正在寻找python用户 组管理包 创建用户组并向该组添加 删除成员 我找到了flask dashed https github com jeanphix Flask Dashed 这或多或少是我一直在寻找的 但它只支持一个用户添加 删除
  • 将 slug 保存到数据库或动态生成更好?

    我正在开发一个 django 项目 并希望在 url 末尾包含一个 slug 就像在 stackoverflow com 上所做的那样 http example com object 1 my slug generated from my
  • Jetpack Compose - 如何在 LazyColumn 中搜索并显示房间中的特定数据?

    我想使用搜索查询从房间表中获取数据 并将结果显示在 LazyColumn 中 而不是我在那里显示的 someList 中 换句话说 如何使用 compose from room table 实现搜索功能 Getting the list f
  • AssertEquals 2 列表忽略顺序

    我相信这应该是一个非常简单的问题 但不知何故我无法在谷歌中找到答案 假设我有 2 个字符串列表 首先包含 字符串A 和 字符串B 第二个包含 字符串B 和 字符串A 注意顺序差异 我想测试它们JUnit检查它们是否包含一模一样字符串 是否有
  • 虽然声明不起作用?

    include
  • 在 EF 中使用 Attach 时,是否可以不覆盖我尚未更新的属性?

    我通过将现有实体附加到我的数据上下文来更新它 如下所示 var updatedDocumentState new AccDocumentState Id accDocumentState Id IsDocumentary accDocume
  • 在 Vim 中有效地附加匹配:g/---/s/---/X/

    如何引用命令中的匹配项g in Vim 我想在比赛后面加上 X 而不替换比赛 例如 在以下命令中 不写create title twice g create title s create title X 你应该得到 create title
  • 如何清除屏幕命令中的回滚?

    我用screen命令用于 Linux 中的命令行多任务处理 我将回滚缓冲区长度设置为一个非常大的值 当我不想再保留某个选项卡时 是否有组合键可以清除该选项卡的缓冲区 这个线程 http osdir com ml gnu screen use
  • 如何在 ItemsControls 中使用 AlternationIndex?

    我看过一些文章展示如何使用AlternationIndex with ListBoxes or ListViews 但我花了几个小时试图在底座上获得交替的背景颜色ItemsControl类 似乎没有任何作用 全部ListBox我看到使用的样
  • 在 C 中使用 true 和 false

    据我所知 在 C 语言中使用布尔值有三种方法 使用 bool 类型 来自 然后使用 true 和 false 使用预处理器定义 define FALSE 0 define TRUE FALSE 只是直接使用常量 即 1 和 0 还有其他我错
  • 如何在 R 中组合两个列表

    我有两个清单 l1 list 2 3 l2 list 4 我想要第三个清单 list 2 3 4 我怎样才能以简单的方式做到这一点 虽然我可以在 for 循环中完成它 但我期待一个单行答案 或者可能是一个内置方法 其实我有一个清单 list
  • 出于单元测试目的覆盖对象属性

    我正在使用 Jest 在 Node js 应用程序上执行单元测试 其中代码源是用 TypeScript 编写的 然后编译为 JavaScript 在我希望测试的一个类中 导入了一个外部模块并使用了该模块中的方法 我想模拟对此方法的调用 以便
  • 区域未传递给 ASP.net Core 中的 Url.Action()

    以下代码在正常的 ASP net MVC 中工作 Url Action actionName controllerName new Area areaName 但它在 ASP net Core 中运行得不太好 区域被识别为查询字符串参数 我
  • 相同值零算法如何工作?

    我正在浏览 Javascript info 中的地图章节 其中有一个关于 SameValueZero 算法的链接 有人可以用简单的语言解释一下该算法是如何工作的吗 我尝试通过链接但找不到任何内容 See the 规格 https www e
  • 如果浏览器是 ie9,则执行某些 javascript

    我想在浏览器低于IE9的情况下执行jQuery中的某些代码 是的 我已经知道了 但我想要的是检查脚本标签内的这个条件并使用 jQuery document ready 您可以通过以下类别定位较旧的 Internet Explorer 版本
  • 如何拆分我的代码的解决方案?

    当您向我的代码提出问题时 它会告诉您您的问题 但我无法更改它 因此它有多种解决方案 它总是为所有不同的问题提供相同的解决方案 我要问的是如何为正确的问题提供正确的解决方案 而不是所有问题都只导致一个解决方案 其中显示 print 您问题的解
  • 在angularjs中使用debounce延迟代码

    我必须在 AngularJS 中编写电子邮件验证功能 当用户使用电子邮件 ID 完成编辑后 我想在 2 秒后发出发布请求 AngularJS 中有没有为此预先定义的方法 fiddle http jsfiddle net Qdk5M 1944