Angularjs - 表单验证 - 简化

Angularjs - form validation - simplfication

本文关键字：简化 验证 表单 Angularjs      更新时间：2023-09-26

Newbie to angularjs/javascript

所以我有很多验证码等，一组用于用户名、电子邮件、密码、名称......有没有办法让它更干净或有一个模板并将字段名称作为参数传递？等。

        <div class="error item-input" ng-show=" joinForm.username.$dirty && joinForm.username.$invalid && isLoginBlurred">
            <small ng-show="joinForm.username.$error.required"> Your username is required.</small>
            <small ng-show="joinForm.username.$error.minlength"> Your username is required to be at least 5 characters</small>
            <small ng-show="joinForm.username.$error.maxlength"> Your username cannot be longer than 20 characters </small>
        </div>

您可以使用 AngularJS 的 ngForm 指令。

<form name="signForm" ng-controller="FormController" novalidate>
<div ng-repeat="f in fields">
    <input type="text" name="{{f.name}}" ng-required="f.isRequired"/>
    <div ng-show="signForm[f.name].$dirty && signForm[f.name].$invalid">
        <span class="error" ng-show="signForm[f.name].$error.required">The field is required.</span>
    </div>
</div>

控制器是 

function FormController(scope) {
scope.fields = [
    { name: 'username', isRequired: true},
    { name: 'password', isRequired: true },
    { name: 'email', isRequired: false}
];
相关文章：