Как перевести и перечислить каждую ошибку формы для пользователя

У меня есть несколько форм с более чем 30 полями ввода, отсортированными по категориям на разных вкладках. Ошибки при отправке отображаются под полями формы.

Как я могу отобразить все ошибки проверки в списке с именем поля и ошибкой проверки? Название поля и сообщение об ошибке также необходимо перевести на немецкий язык.

Это код, который я пытаюсь использовать до сих пор:

 getFormValidationErrors() {
    const errors = [];
    Object.keys(this.form.controls).forEach(key => {

        const controlErrors: ValidationErrors = this.form.get(key).errors;
        if (controlErrors != null) {
            Object.keys(controlErrors).forEach(keyError => {
                errors.push({
                    'field': key,
                    'error': keyError,
                    'value': controlErrors[keyError]
                });
            });
        }
    });

    console.log(errors);

    return JSON.stringify(errors);
}

На данный момент это результат в html:

[{"Field":"name","Error":"required","value":true},{"Field":"official_name","Error":"required","value":true},{"Field":"address_zip","Error":"notInRange","value":true},{"Field":"address_zip","Error":"required","value":true},{"Field":"address_city","Error":"required","value":true},{"Field":"tenant","Error":"required","value":true}]

То, что я хочу показать, выглядит примерно так (но также переведено на немецкий язык):

Name: Required, Official Name: Required

typescript angular angular-material angular-forms angular-validation
person ohnoe    schedule 17.10.2019    source источник
comment
Что вы пробовали до сих пор?   -  person MoxxiManagarm    schedule 17.10.2019
comment
@MoxxiManagarm Я отредактировал свой вопрос, показывая код, который я пытался использовать до сих пор.   -  person ohnoe    schedule 17.10.2019
comment
Получает ли ваш массив ошибок значения, когда вы делаете ошибки?   -  person Eudz    schedule 17.10.2019
comment
@Eudz показывает все ошибки. Не хватает только перевода и форматирования.   -  person ohnoe    schedule 17.10.2019
comment
@ohnoe для перевода, я думаю, вы можете использовать i18n: angular.io/guide/i18n   -  person Eudz    schedule 17.10.2019

Ответы (1)


arrow_upward
0
arrow_downward

Это больше похоже на проблему форматирования, чем на что-либо другое. Почему нет:

Вместо того

errors.push({
    'field': key,
    'error': keyError,
    'value': controlErrors[keyError]
});

do 

if (controlErrors[keyError]) {
    errors.push({
        this.getFieldLabel(key): this.getErrorLabel(error)
    });
}

где функции getFieldLabel и getErrorLabel отвечают за перевод / выборку. Возможно, вам даже не понадобится формат объекта - вам может подойти строка - не знаете, как вы справляетесь с визуализацией текста.

person G. Tranter    schedule 17.10.2019