gpt4 book ai didi

angularjs - Angular - 提交后清除表单输入

转载 作者:行者123 更新时间:2023-12-03 11:21:02 26 4
gpt4 key购买 nike

我有一个简单的表格,如下所示:

<form name="add-form" data-ng-submit="addToDo()">
<label for="todo-name">Add a new item:</label>
<input type="text" data-ng-model="toDoName" id="todo-name" name="todo-name" required>
<button type="submit">Add</button>
</form>

与我的 Controller 如下:
$scope.addToDo = function() {
if ($scope.toDoName !== "") {
$scope.toDos.push(createToDo($scope.toDoName));
}
}

我想要做的是在提交后清除文本输入,所以我只需清除模型值:
$scope.addToDo = function() {
if ($scope.toDoName !== "") {
$scope.toDos.push(createToDo($scope.toDoName));
$scope.toDoName = "";
}
}

除了现在,因为表单输入是“必需的”,我在表单输入周围有一个红色边框。这是正确的行为,但在这种情况下不是我想要的......所以我想清除输入然后模糊输入元素。这导致我:
$scope.addToDo = function() {
if ($scope.toDoName !== "") {
$scope.toDos.push(createToDo($scope.toDoName));
$scope.toDoName = "";
$window.document.getElementById('todo-name').blur();
}
}

现在,我知道像这样从 Controller 修改 DOM 在 Angular 文档中是不受欢迎的 - 但是有没有更 Angular 的方法来做到这一点?

最佳答案

当您为表单命名时,它会自动添加到 $scope .

因此,如果您将表单名称更改为“addForm”(因为我认为 add-from 不是 angular 的有效名称,不知道为什么),您将引用 $scope.addForm .

如果您使用 angular 1.1.1 或更高版本,您将获得 $setPristine() $scope.addForm上的方法.这应该递归地处理重置您的表单。或者如果您不想使用 1.1.x 版本,您可以 look at the source并效仿它。

关于angularjs - Angular - 提交后清除表单输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14684877/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com