如何在一段时间间隔后隐藏div？

Question

代码是

 <security>
     <authentication>
         <!--<anonymousAuthentication enabled="true" />-->
     </authentication>
 </security>

想法是在发送报告时显示此div，意味着 <div class="sendStatus" ng-if="reportSent"> <span data-icon="ok"></span> {{progressStatus}} </div> 为真。现在我想在reportSent之后隐藏这次潜水。我该怎么做？

Answer 1

$timeout可用于在延迟后隐藏div

var app = angular.module('app', []);

app.controller('myController', function($scope, $timeout) {
  $scope.sendReport = function() {
    $scope.reportSent = true;
    $timeout(function() {
      $scope.reportSent = false;
    }, 2000);
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<div ng-app='app' ng-controller='myController'>
  <button ng-click="sendReport()">send report</button>
  <div class="sendStatus" ng-if="reportSent">Report Sent</div>
</div>

Answer 2

您可以使用$timeout（您注入控制器的依赖关系）。

示例：

$scope.reportSent = true;
$timeout(function() {
    $scope.reportSent = false;
}, 2000);