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

Question

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

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

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

点击事件:

$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>

Controller .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>