当点击时,我有一个下面的按钮显示一个小的弹出窗口,如通知
<button id="element" type="button" onclick="ShowNotifications()" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Text inside popup">Notifications</button> <script type="text/javascript"> function ShowNotifications() { $('#element').popover('open'); } </script>
我的意图是每隔几秒钟显示此弹出窗口,而不需要单击按钮,而是从AngularJS控制器。
var showPop = function () { //how can i call that jQuery function here ?? $timeout(showPop,1000); } $timeout(showPop,1000);
试用以下解决方案
app.directive("showNotifications",["$interval",function ($interval) { return { restrict: "A",link: function(scope,elem,attrs) { $interval(function () { $(elem).popover("open"); alert('hi'); },1000); } }; }]);
还包括脚本
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" /> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script> <script src="js/app.js"></script> <script src="js/postsService.js"></script> <script src="js/directive.js"></script> <script src="js/controllers.js"></script>
使用这样的指令
<button id="element" type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Friend request 1" **show-notifications**>Live Notifications</button>
指令用于DOM操作:
原文链接:/angularjs/144052.html<button show-notifications>
和指令
.directive("showNotifications",function($interval) { return { restrict: "A",attrs) { //On click $(elem).click(function() { $(this).popover("open"); }); //On interval $interval(function() { $(elem).popover("open"); },1000); } } }]);