javascript - 此示例中的 ng-show 不起作用

Question

我想要的是当我单击一个按钮并在 2 秒后隐藏它时显示一个 DIV。

<div ng-show="alertMsg.show">{{alertMsg.text}}</div>

触发点击事件后，DIV正确显示，但无法隐藏。似乎“alertMsg.show”的值在 2 秒后已正确更改为 FALSE，但视图中仍然存在 DIV。

点击事件：

$scope.$apply(function(){
            $scope.alertMsg.show = true;
        });

        $timeout(function () {
            $scope.alertMsg.show = false;
        }, 2000);

我想知道如何通过 $timeout 隐藏 DIV

Answer 1

隐藏有时间限制的节目

实时代码在这里http://jsfiddle.net/dofrk5kj/4/

HTML

<div ng-controller="homeController">
        <button ng-click="showAlert()"> Show alert </button>
      <div ng-show="alertMsg.show">{{alertMsg.text}}</div>
</div>

控制器.js

controller('homeController', function ($scope, $timeout) {
     $scope.alertMsg = {
        show: false,
        text:"Alert message is ::show"
     };
     $scope.showAlert =function(){
         $scope.alertMsg.show = true;
         $timeout(function(){      
             $scope.alertMsg.show = false;
          }, 2000);
     }
   });

但您可以使用单独的标志来隐藏/显示警报

<alert ng-repeat="alert in alerts" type="{{alert.type}}"
                    close="closeAlert($index)">{{alert.msg}} </alert>