Html AngularJS-让元素在值更改后仅几秒钟内可见

我观察了一些我经常在网页上显示的变量

控制器：

 self.mapView.watch('center,scale,zoom', function() {
     $scope.$applyAsync('vm.mapView');
 });

HTML:

LAT{{vm.mapView.center.LATIONE |编号：3}}
LNG{{vm.mapView.center.longitude}编号：3}

现在，我真的希望整个info

div

在其中一个变量更改后5秒淡出（并且在下次值更改时再次可见5秒）

---

在CSS中也可能出现这种情况吗？

在CSS中实现这一点的一种方法是使用不透明度：

.altered-element.hide-opacity{
    opacity: 0;
}

.altered-element {
    color: #FFFFFF;
    text-align: center;

    -webkit-transition: opacity 3s ease-in-out;
    -moz-transition: opacity 3s ease-in-out;
    -ms-transition: opacity 3s ease-in-out;
    -o-transition: opacity 3s ease-in-out;
     opacity: 1;
}

CSS中的另一种方式：

---

^更多最新信息，请使用CSS3。

您应该使用$timeout进行延迟，使用ng animate进行淡出。如果您还没有尝试过这些，请在Angular的文档中查找它们，它们将非常有用

.altered-element.hide-opacity{
    opacity: 0;
}

.altered-element {
    color: #FFFFFF;
    text-align: center;

    -webkit-transition: opacity 3s ease-in-out;
    -moz-transition: opacity 3s ease-in-out;
    -ms-transition: opacity 3s ease-in-out;
    -o-transition: opacity 3s ease-in-out;
     opacity: 1;
}