将事件绑定到角度指令内的 $(document)

2024-03-10

我有一个实现选择框的指令。
现在,当选择框打开并且我单击其外部的某个位置(文档中的任何其他位置)时,我需要它折叠。

这个 JQuery 代码在我的指令中工作,但我想以“有角度的方式”执行它:

  $(document).bind('click', function (e) {
       var $clicked = e.target;
       if (!$clicked.parents().hasClass("myClass")) {
            scope.colapse();
       }
  });

我尝试将 $document 服务注入到我的指令中,但没有成功。


我相信,最真实的 Angular 方式是使用angular.element代替jQuery并访问window.document通过$document服务:

(function() {

  angular.module('myApp').directive('myDocumentClick', 
    ['$window', '$document', '$log',
    function($window, $document, $log) {
      return {
        restrict: 'A',
        link: function(scope, element, attrs) {
          $document.bind('click', function(event) {
            $log.info(event);
            if (angular.element(event.target).hasClass('myClass')) {
              $window.alert('Foo!');
            }
          })
        }
      };
    }
  ]);

})();

笨蛋链接 http://plnkr.co/edit/TBdfMLp9mIBhZR9E4wXo?p=preview

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

将事件绑定到角度指令内的 $(document) 的相关文章

  • 我在 firebase.auth.ApplicationVerifier 中遇到问题

    错误发生在signInWithPhoneNumber 的第二个参数中 我无法解决这个问题 我使用了三种方法来发送 otp 验证 otp 和最后用于验证码 methods sendOTP e e preventDefault if this
  • 使所有打开的文档选项卡可见

    我想查看我在 Visual Studio 中打开的所有文件或文档 我不希望它们自动隐藏或溢出时隐藏 我怎样才能实现它 执行此操作的内置选项之一 使用固定选项卡 http dailydotnettips com 2016 01 21 pers
  • Moment.js 在 Firefox 中返回 NaN,但在 Chrome 中不返回 NaN

    我有以下代码行 moment 11 10 2013 09 03 AM diff moment minutes 在 Chrome 30 0 1599 101 中 以下行返回一个数字 它每分钟都会更改 因此确切的值不相关 在 Firefox 2
  • 如何修复 Eslint 错误“prefer-destructuring”?

    我想像这样缩短 ES6 中的对象文字 const loc this props local 原因是loc foo 比打字容易得多this props local foo 但现在 ESLint 抱怨道 使用对象解构 prefer destru
  • 如何观察Firebase存储上传事件

    我有一个将照片上传到 Firebase 存储的 iOS 应用程序 以及一个连接到同一个 Firebase 的 Web 应用程序 有没有办法从网络上观察存储的变化 当上传照片时 只有iOS设备本身可以访问UploadTask 并且我没有看到o
  • 这个作用域/闭包什么时候在 javaScript 中被垃圾回收?

    我正在做一门课程 该课程正在讨论范围 闭包并简要提到垃圾收集 课程中提出一个问题 范围保持多久 答案是 直到 不再有任何提及它 是的 所以我们基本上说的是 是的 闭包有点像对隐藏范围对象的引用 所以只要有一些函数仍然有一个闭包 范围 该范围
  • 将数组传递给 include() javascript

    我试图找出一个字符串是否包含存储在数组中的多个字符串 includes 所以我尝试过 let string hello james console log string includes hello james 但它被返回为false 当我
  • 如何使用 JavaScript 或 jQuery 获取 html 元素的比例值?

    我想知道如何获得元素的比例值 我努力了 element css webkit transform 返回matrix scaleX 0 0 scaleY 0 0 有没有办法得到scaleX and scaleY only 找出文档和元素之间的
  • 将数据发送到 parse.com 并更新 Angular $scope

    我正在将数据发送到 parse com 上的类 我想运行此函数并更新 scope无需重新加载视图 创建一个Programme运行下面的函数工作正常 但是有时在创建新程序后不会更新视图 并且需要刷新页面 当调用整个函数时 如底部所示 getP
  • 我将与 ng-include 一起使用什么文件路径?

    我的角度项目的路径是这样的 web server py flask server program app static app js controllers js etc templates index html home html 索引
  • onchange 选择框

    假设我们有 2 个不同的选择框 具有相同数量的选项
  • 如何将java数组列表转换为javascript数组? [复制]

    这个问题在这里已经有答案了 我们如何将 String 对象的 java arraylist 转换为 javascript 数组 这就是我正在做的事情 但我正在寻找更好的方法来做到这一点 我不想迭代数组列表 var myArray
  • 根据用户投票移动 div

    我是新来的 但我喜欢这个网站 我检查了其他类似的问题 但没有看到我要找的东西 我是一名音乐家 有一段时间我一直在做 每日之歌 每天写一首小歌 我想将歌曲发布为 div 在里面 li 在 div 中 我只想要一个简单的 mp3 播放器和一个
  • Jquery 手风琴默认不折叠

    我正在使用 bootstrap 提供的折叠插件 这是一个 jquery 简单插件 但是它默认折叠 如何修改以使折叠项默认隐藏 只有当我按下标题时 该项目才会折叠并显示 谢谢 插件的文档 只有几行 所以只需要一分钟 http twitter
  • 是否包括触摸事件客户端X/Y 滚动?

    我正在尝试获取相对于的触摸坐标viewport来自触摸事件的浏览器 例如触摸启动 我尝试从 clientX Y 属性获取它们 但两者实际上都返回包括滚动在内的值 这是违反规范的 因为它说 clientX Y 应该返回坐标而不滚动 我尝试添加
  • ES6 - 有没有一种优雅的方法来导入所有命名导出而不是默认导出?

    我正在寻找一种优雅的方法来导入所有命名导出 而不必导入默认导出 在一个文件中 我导出许多命名常量以及默认值 myModule js const myDefault my default export const named1 named1
  • 展平数组中的对象

    大家好 我从响应中获取了一系列对象 我需要将所有学生对象展平为简单的学生姓名 但不确定如何进行 任何帮助将不胜感激 数组示例 students id 123456 name Student Name active true students
  • 如何了解来自不同...“命名空间”的变量?

    如何从外部 javascript 文件中访问在另一个地方声明的某个变量 假设在一个 html 文件中我有以下内容 在 otherfile html 的部分中 我有 alert a 我如何确保收到一条提示消息 某事 我认为Google Ads
  • Firebug 分析问题:“没有要分析的活动”

    我想用一些 javascript jQuery 尝试一些不同的选项 看看哪个是最快的 但是我无法让分析正常工作 这是我要测试的代码 this keypress function e console profile test retrieve
  • JS 中的展开/休息运算符如何工作? [复制]

    这个问题在这里已经有答案了 我正在努力完全理解扩展 休息运算符在 JS 中的工作原理 我已经阅读了 MDN 文档 但我仍然不完全清楚 我在下面提供了一个示例 我在其中使用了它并且它按预期工作 const users name Samir a

随机推荐

  • 如何刷新表中的单行?

    是否可以刷新a的单行vaadin table成分 到目前为止 如果表行编辑完成 我只需刷新整个表 table refreshRowCache 但这可能会导致稍后的大型表出现性能问题 那么 如何刷新单行呢 我在 Vaadin 论坛上发现了这个
  • Array.delete(object) 从数据库中删除?

    所以我试图获取一系列不包含 post 的帖子 令我惊讶的是 下面的代码导致 post 被从数据库中删除 post Post find 2 posts Post where text gt title posts delete post 为什
  • Android onNewIntent() 通知未正确执行

    我有一个用于通知的广播接收器 我的应用程序是一个 webkit 我希望当用户单击通知时打开我的应用程序并定向到某个 URL 一切似乎都工作正常 但我现在遇到了问题 onNewIntent 如果用户上次通过按主页按钮退出应用程序 则调用此方法
  • 相机标定opencv

    你好 我正在做一个项目来进行图像 3D 重建 我正在校准相机的阶段 这需要很长时间才能完成 但是当我编译代码并在相机前显示棋盘时 它会直接进入未处理的异常错误 当图片不在框架中时 一旦进入框架就没有错误 出现未处理的错误我不知道为什么 我问
  • ActiveJob Deliver_later 不发送

    我有以下方法 UserMailer comment alert comment user type deliver later 奇怪的是 它与参数一起出现deliver now在 Rails 日志中 ActiveJob Enqueued A
  • 如何在 Kotlin DSL 中有条件地接受 Gradle 构建扫描插件服务条款?

    这基本上延伸了这个问题 https stackoverflow com q 52636622 1127485使用 Kotlin DSL 而不是 Groovy DSL 如何Groovy DSL 解决方案 https stackoverflow
  • 将 ASP.net Core 2.0 部署到 Azure

    我已通过以下步骤将 ASP net Core 1 1 应用程序升级到 ASP net Core 2 0 将目标框架更改为2 0 升级所有 Nuget 包 现在 我从 git 进行的自动部署运行并显示成功 但应用程序未运行 我收到以下错误 H
  • R,dplyr - group_by()和arrange()的组合不会产生预期的结果?

    使用 dplyr 函数时group by 紧接着arrange 我希望得到数据帧已排序的输出within我所说的组group by 我对文档的阅读是 这种组合应该产生这样的结果 但是当我尝试时 这不是我得到的 并且谷歌搜索并没有表明其他人遇
  • 将 Boost 适配器与 C++11 lambda 结合使用

    我尝试编译这段代码 include
  • 虚拟继承混乱

    我正在阅读有关继承的内容 并且有一个主要问题 我几个小时都无法解决 给定一个类Bar是一个类virtual功能 class Bar virtual void Cook 两者有什么不同 class Foo public Bar virtual
  • CollectionView 内的按钮不可点击

    我在集合视图的自定义单元格中有一个按钮 集合视图位于滚动视图上 由于某种原因 我无法单击该按钮 我已检查我的所有元素是否都启用了用户交互 Here is my layout of the collection I ve hidden som
  • XSLT:通过递增属性和值生成多个对象

    我有一个如下所示的 xml 我想复制 n 次 同时递增其元素之一和属性之一 XML 输入
  • 使用鼻子进行测试的 Python 导入 - 导入当前包之上的模块的最佳实践是什么

    这是一个经常以不同形式被问到的问题 并且经常得到 哈哈 你做得不对 的回答 很确定这是因为人们 包括我 尝试使用一个常识性场景作为实现 并且解决方案并不明显 如果您以前没有这样做过 会接受 让飞出瓶子 的答案 Given project i
  • 为什么Delete既是DDL又是DML语句

    我目前正在阅读 Microsoft 官方书籍 数据库管理基础知识 准备参加考试 我了解 DDL 和 DML 是什么 但 Microsoft 将 DELETE 显示为 DDL 和 DML 语句 我已经用谷歌搜索过这一点 但我无法证实或否认这一
  • 关于weak_ptr的线程安全性

    std shared ptr
  • 使用 Java 进行 AWS S3 文件搜索

    我们使用 java 类从 AWS s3 存储桶下载文件 代码如下 inputStream AWSFileUtil getInputStream AWSConnectionUtil getS3Object null cdn generalse
  • 从 Java 应用程序调用 Servlet

    我想从 Java 应用程序调用 Servlet 问题是 该调用似乎没有到达 Servlet 我没有收到任何错误 但没有到达 Servlet 中的第一个输出 doPost 如果我在网络浏览器中打开 URL 我当然会得到不支持 GET 等错误
  • 如何阻止 dbentityentry.currentvalues.setvalues 尝试更改实体键值

    我正在使用以下代码使用从我的代码收集的新信息来更新实体对象 我在用实体框架5 我使用以下扩展方法 作为我在 EF4 中使用的重新附加代码的替代方法 public static void ApplyValues this object cur
  • 如何强制 WPF 应用程序在管理员模式下运行

    我有一个 WPF 应用程序 可以访问本地计算机上的 Windows 服务 任务计划程序 当我部署此 WPF 应用程序并在没有 以管理员身份运行 的情况下运行它时 它会失败 因为它无法访问本地计算机上的 Windows 服务和任务计划程序 如
  • 将事件绑定到角度指令内的 $(document)

    我有一个实现选择框的指令 现在 当选择框打开并且我单击其外部的某个位置 文档中的任何其他位置 时 我需要它折叠 这个 JQuery 代码在我的指令中工作 但我想以 有角度的方式 执行它 document bind click functio