我尝试实现的工作流程有问题。
在我的应用程序中,我有几个标有指令的文本框,如下所示:
<input type="text" data-unique-function-name
data-is-valid="isValid"
data-ng-model="function.Name" />
我有一个“保存”按钮,它应该在我的所有 UniqueFunctionName 指令中触发验证,因此我在单击按钮时分派(dispatch)一个事件,如下所示:
function TriggerValidation()
{
scope.$broadcast('uniqueFunctionName::checkUniqueFunctions');
}
这是由我的指令处理的,如下所示:
scope.$on('uniqueFunctionName::checkUniqueFunctions',
function () {
functionService.validate(scope.ngModel).success(function (data) {
if (data != null) {
scope.isValid = false;
}
});
});
scope.isValid 变量从我的应用程序传递到每个 uniqueFunctionName 指令。如果上述任何验证失败,isValid 将更改为 false
。
我现在想做的是当用户按下保存按钮时触发验证,并且只有在继续之后scope.isValid 仍然为 true 时才触发验证。我已经尝试过了,但显然行不通。
TriggerValidation(); //dispatch the event
if (scope.isValid) {
//continue
} else {
//display error message
}
有办法实现吗?
最佳答案
它是内置的!
执行此操作所需的一切都可以在 Angular 中实现,但具体如何实现还不是很明显。一、根据AngularJS Forms Guide ,你应该包围你的<input />
具有带有 name 属性的表单的元素。例如:
<form name="myForm">
<input type="text" ng-model="formData.userName" name="userName" />
</form>
现在,在 Controller 的 $scope 内,您可以访问 FormController实例使用 $scope.myForm
,它有许多有用的属性。例如, $valid
property .
您可以在 Controller 中使用它,如下所示:
if ($scope.myForm.$valid) {
// do something with the comfort that all your fields are validated
}
您还可以使用 $scope.myForm.userName.$valid
访问单个输入的验证状态(假设您也为这些输入提供了名称属性) .
最重要的是,它在每次模型更新后运行,因此无需调度自定义事件。 Angular 将运行验证代码并为您设置变量,这会消除您尝试让异步代码同步运行的问题。
自定义验证
如果除了 Angular 提供的验证(电子邮件、号码、网址等)之外,您不需要对输入进行任何特殊验证,只需添加 appropriate attributes Angular 会做正确的事情,使结果在 FormController 的 $valid 和 $error 属性上可用。
有一个非常简单的方法来制作 custom validators (有关简单示例,请参阅整数示例)。我实际上还没有编写过比这更复杂的验证器,因此我将在 Angular 文档和其他 Stackoverflow 答案中解释更多内容。
关于javascript - AngularJS : validate before continuing,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31030650/