angular中監控模態框關閉
阿新 • • 發佈：2020-08-12
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="../lib/reset.css">
<link rel="stylesheet" href="../lib/bootstrap-3.3.7/css/bootstrap.min.css">
<script src="../lib/angular-1.7.0/angular.min.js"></script>
<script src="../lib/jquery/jquery.min.js"></script>
<script src="../lib/bootstrap-3.3.7/js/bootstrap.js"></script>
</head>
<body ng-app="app">
<div ng-controller="myCtrl">
<!-- 按鈕觸發模態框 -->
<div class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" ng-click="test()">
開始演示模態框
</div>
<!-- 模態框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-hidden="true">×
</button>
<h4 class="modal-title" id="myModalLabel">
<!-- 模態框（Modal）標題-->
GOTOP資料監控
</h4>
</div>
<div class="modal-body">
<!-- 模態框（Modal）主題內容-->
</div>
<div class="modal-footer">
<!-- 模態框（Modal）尾部 -->
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</div>
<script>
var app=angular.module('app',[]);
app.controller('myCtrl',function($scope,$interval,$http){
// var url_key='http://29w8827m29.wicp.vip:20381/opsYun/windows/getdiskcurrent?serverid=201';
// function getData(url){
// $http({
// method: 'GET',
// url: url
// }).then(function successCallback(result) {
// var response=result.data;
// if(response.success){
// $scope.data=response.body;
// }
// }, function errorCallback(response) {
// // 請求失敗執行程式碼
// });
// }
// $scope.test=function(){
// var timer=$interval(function(){
// $scope.data;
// getData(url_key);
// console.log($scope.data)
// },2000);
// $('#myModal').on('hidden.bs.modal', function () {
// $interval.cancel(timer);
// })
// };
// 沒有後臺數據的時候進行模擬
var timer;
$scope.test=function(){
timer=$interval(function(){
console.log("我成功了");
},1000)
};
$('#myModal').on('hidden.bs.modal', function () {
$interval.cancel(timer);
})
});
</script>
</body>
</html>