如何使用带有express-validator的nodejs显示每个输入字段的错误？答案

【问题标题】：How to show errors each input fields using nodejs with express-validator?如何使用带有express-validator的nodejs显示每个输入字段的错误？
【发布时间】：2019-02-27 05:27:32
【问题描述】：

这个问题已经问过了，但没有解决我的问题。

我是Nodejs 的新成员。我尝试在插入数据时验证表单。

这里使用express-validator，错误信息显示在form的顶部。

这是我的错误信息：

但我希望它显示在每个输入字段下

这是我的代码

.pug：

form(action="/admin/add_employee", method="POST")
    .form-group
        label.col-form-label First Name
        input.form-control(type="text", name="first_name", placeholder="Enter employee first name")
        div(style='color:red') #{errFirstName}
    .form-group
        label.col-form-label Last Name
        input.form-control(type="text", name="last_name", placeholder="Enter employee last name")
        div(style='color:red') #{errLastName}
    .form-group
        label.col-form-label Email
        input.form-control(type="email", name="email", placeholder="Enter employee email id")
    .form-group
        label.col-form-label Phone
        input.form-control(type="text", name="phone", placeholder="Enter employee phone")
    .form-group
        label.col-form-label Address
        textarea.form-control(type="text", name="address", placeholder="Enter employee address")
    input.btn.btn-primary(type="submit", name="save", value="Save Employee")

.js：

router.post('/add_employee', function(req, res){
    const first_name = req.body.first_name;
    const last_name = req.body.last_name;
    const email = req.body.email;
    const phone = req.body.phone;
    const address = req.body.address;

    req.checkBody('first_name', 'Please enter employee first name').notEmpty();
    req.checkBody('last_name', 'Please enter employee last name').notEmpty();
    req.checkBody('email', 'Please enter employee email').notEmpty();
    req.checkBody('email', 'Invalid Email id').isEmail();
    req.checkBody('phone', 'Please enter employee phone').notEmpty();
    req.checkBody('address', 'Please enter employee address').notEmpty();

    let errors = req.validationErrors();

    if(errors)
    {
        res.render('emp_add', {
            errors: errors
        });
    }
    else
    {
        let employee_data = Employee();
        employee_data.first_name = first_name;
        employee_data.fast_name = last_name;
        employee_data.email = email;
        employee_data.phone = phone;
        employee_data.address = address;
        employee_data.status = 1;

        console.log(employee_data);
        employee_data.save(function(err){
            if(err)
            {
                console.log(err);
                return;
            }
            else
            {

                req.flash('success', 'Employee added successfully');
                res.redirect('employee_list');
            }
        });
    }
});

我想在文本框下显示错误信息

【问题讨论】：

标签： node.js validation express express-validator

【解决方案1】：

您在验证时遇到的错误是一个数组。

对于第一条错误消息使用 -

errors[0].msg

虽然您也可以使用以下库在前端添加验证，但有一个建议 - Library 这个库是可定制的，很棒。

【讨论】：

【解决方案2】：

您可以在服务器端编写一个函数来循环您的错误并返回一个以字段名称为键、错误为值的对象。

for (let i=0; i<errors.errors.length; i++) {
    newErrors[errors.errors[i].param] = errors.errors[i].msg
}

然后，您可以在 p 标签等中显示错误，使用 this.state.errors.username 或密码或您在将其发送到服务器端时调用的任何名称。

【讨论】：