angularjs - 如何淡入然后淡出 a 中的文本

Question

我的网页有以下标签：

<div data-ng-model="modal.data.message"></div>

有没有一种简单的方法可以使消息“自动保存”淡入视图，<div>然后在函数返回几秒钟后淡出。

Answer 1

将ngShow指令添加到您的 div：

<div ng-model="message" ng-show="showMessage" class="message fadein fadeout">{{message}}</div>

保存开始时设置showMessage = true和要显示的消息。保存完成后设置showMessage = false。要在保存完成后显示消息一段时间，您可以使用$timeout：

// Loadind done here - Show message for 3 more seconds.
$timeout(function() {
    $scope.showMessage = false;
}, 3000);

动画部分取决于您使用的 AngularJS 版本。

这是使用 1.2 的示例：http ://plnkr.co/edit/jBukeP?p=preview