重置HTML表单字段（避免撤消功能）

Question

我在SPA（基于AngularJS的单页应用程序）中遇到问题。

场景：

1. 用户使用包含用户名和密码的导航栏登录到系统，在幕后，我正在重置包含登录名和密码的表单。

2. 用户按下指向其个人资料的链接。

3. 按下导航栏注销按钮，我会将用户发送到主页。

4. 如果我站在用户名输入控件中，然后按Control + Z来撤消，则会得到用户名，而另一个Control + Z也会检索密码。

如何重置这两个字段的撤消（历史）功能。

顺便说一句：如果我刷新页面，它就消失了。

谢谢，
陈

Answer 1

在IE和Firefox中，这似乎是一个问题（或功能？），但在Chrome中似乎没有发生。

从输入框中清除撤消历史记录的一种快捷方法是从DOM中删除撤消历史记录并将其重新添加。 在Angular中，我们可以使用ngIf ...

<input ng-model="user.username" type="text"     ng-if="enabled" placeholder="Username" />
<input ng-model="user.password" type="password" ng-if="enabled" placeholder="Password" />

清除文本框时，切换enabled属性...

$scope.clear = function () {
    $scope.user = {};

    $scope.enabled = false;
    $timeout(function () { $scope.enabled = true });
}; 

现场演示