javascript - 如何使用 AngularJS 在单击正文内的任意位置时显示弹出窗口?

标签 javascript jquery html angularjs

如果互联网可用,我必须显示一条弹出消息,以便在单击页面正文中的任意位置时显示网络连接。使用 JavaScript,我们可以通过使用 addeventlister 来完成此操作,如下所示。

但是我如何实现这一目标呢?

document.body.addEventListener("click", function(){
   alert("hello");
});

最佳答案

在 AngularJS 中执行此操作的一种方法是使用 ng-click 指令。基本上,您将警报和网络状态检查代码封装在页面 Controller 的作用域方法中。

app.controller('mainCtrl', function($scope) {
  $scope.message = 'Click the button';
  $scope.showMessage = function() {
    // Simple example that doesn't check network status or
    // display anything of real value other than verifying
    // that a click anywhere on the page will invoke this method
    alert('hello');
  }
});

完成此操作后,您将把 ng-click="showMessage" 指令放置在您想要附加事件监听器的元素上。在此示例中,我使用了整个 body 。

  <body ng-controller="mainCtrl" ng-click="showMessage()">
    <h1>Hello Plunker!</h1>
    <p>Click anywhere</p>
  </body>

Here is a basic plunk, to test it out.

关于javascript - 如何使用 AngularJS 在单击正文内的任意位置时显示弹出窗口?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37235199/

相关文章:

javascript - 在 Javascript 中创建类的不同方法有名称吗?它们是什么?

javascript - 在 Angular 中调用远程 URL 时 CORS 策略错误

javascript - 防止 jQuery Mobile Popup 上的双击关闭行为

javascript - 如何使用jquery获取双击之间的时间差?

javascript - 内部 div 滚动不适用于 firefox 浏览器

javascript - 如何在 Eclipse 中为 JavaScript 项目的 DOM 启用代码辅助

javascript - 使用 Laravel 自动完成谷歌地图

javascript - 如何为html中的多个元素设置相同的id

jquery - 如果单击,如何删除输入中的蓝色框和 Bootstrap 中的按钮

javascript - 清除更改功能的表单字段会删除表单发布值