Blazorサーバー側で検証メッセージ(DataAnnotationsValidator)をローカライズする方法


10

VS 2019の最新バージョンでblazor 3.1を使用しています。

これまでのところ、ページラベル(タイトル、テーブルフィールドなど)をローカライズできます。

ではListEmployee.razorページ私は、テーブルの見出しなどをローカライズすることができていますし、上のAddEmplyeeValidation.razorページ私は、ローカライズのフォームラベルにできるようですが、私は、問題の検証メッセージをローカライズしています。

検証メッセージのEmployee.cs検証メッセージは、このファイルとResources/Dataフォルダで定義されてData.Employee.ar.resxおりData.Employee.ar.resx、次のように定義されています。

System.ComponentModel.DataAnnotationsを使用します。

名前空間BlazorSPA1.Data {public class Employee {[MaxLength(50)] public string Id {get; セットする; }

    [Required (ErrorMessage ="Name is RRRequired")]
    [StringLength(20, ErrorMessage = "Name is too long.")]
    public string Name { get; set; }

    [Required]
    [StringLength(20)]
    public string Department { get; set; }
    [MaxLength(100)]
    public string Designation { get; set; }
    [MaxLength(100)]
    public string Company { get; set; }
    [MaxLength(100)]
    public string City { get; set; }
}

}

従業員の追加フォームの言語に基づいて、リソースファイルからの検証メッセージをどのようにできますか。

@page "/addemployeeValidation"
@inject NavigationManager NavigationManager
@inject IEmployeeService EmployeeService
@inject IStringLocalizer<AddEmployeeValidation> L

<h2>Create Employee</h2>
<hr />
<EditForm Model="@employee" OnValidSubmit="@CreateEmployee">
    <DataAnnotationsValidator />
    <ValidationSummary />
    <div class="row">
        <div class="col-md-8">
            <div class="form-group">
                <label for="Name" class="control-label">@L["Name"]</label>
                <input for="Name" class="form-control" @bind="@employee.Name" />
                <ValidationMessage For="@(()=> employee.Name)" />
            </div>
            <div class="form-group">
                <label for="Department" class="control-label">@L["Department"]</label>
                <input for="Department" class="form-control" @bind="@employee.Department" />
            </div>
            <div class="form-group">
                <label for="Designation" class="control-label">@L["Designation"]</label>
                <input for="Designation" class="form-control" @bind="@employee.Designation" />
            </div>
            <div class="form-group">
                <label for="Company" class="control-label">@L["Company"]</label>
                <input for="Company" class="form-control" @bind="@employee.Company" />
            </div>
            <div class="form-group">
                <label for="City" class="control-label">@L["City"]</label>
                <input for="City" class="form-control" @bind="@employee.City" />
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-4">
            <div class="form-group">
                <input type="submit" class="btn btn-primary" value="Save" />
                <input type="button" class="btn" @onclick="@Cancel" value="Cancel" />
            </div>
        </div>
    </div>
</EditForm>

@code {

    Employee employee = new Employee();

    protected async Task CreateEmployee()
    {
        await EmployeeService.CreateEmployee(employee);
        NavigationManager.NavigateTo("listemployees");
    }


    void Cancel()
    {
        NavigationManager.NavigateTo("listemployees");
    }
}   

私はいくつかの記事を読んで、いくつかのことを試しましたが、何も機能していないようです

Startup.csのコード `

services.AddServerSideBlazor(options => options.DetailedErrors = true);

    services.AddLocalization(options => options.ResourcesPath = "Resources");
    var supportedCultures = new List<CultureInfo> { new CultureInfo("en"), new CultureInfo("ar") };
    services.Configure<RequestLocalizationOptions>(options =>
    {
        options.DefaultRequestCulture = new Microsoft.AspNetCore.Localization.RequestCulture("en");
        options.SupportedUICultures = supportedCultures;
    });

ローカライズに次の例を使用していますが、エラーメッセージをローカライズする方法を示していません https://www.c-sharpcorner.com/article/localization-in-blazor-server/

屈折のフォルダー構造画像

ここに画像の説明を入力してください

アラビア語ファイルもあるのと同じ方法で英語版のリソースファイルの例

ここに画像の説明を入力してください

下のスクリーンショットでは、フィールド名がリソースファイルからプルされていますが、検証メッセージは機能していないため、英語でのみ表示されます。

ここに画像の説明を入力してください

回答:


7

これが、データ注釈エラーメッセージをローカライズするための私の解決策です。フィールド用とエラーメッセージ用の2​​つのリソースファイルを作成します。

  • DisplayNameResource フィールドのローカライズ用
  • ErrorMessageResource エラーメッセージをローカライズするため

ここに画像の説明を入力してください ここに画像の説明を入力してください ここに画像の説明を入力してください ここに画像の説明を入力してください

ビューモデルクラスでは、Display属性を使用してフィールド名をローカライズします。属性のリソースファイル使用ResourceTypeプロパティを指定するにDisplayは:

[Display(Name = "Address", ResourceType = typeof(DisplayNameResource))]

検証属性ではErrorMessageResourceName、およびErrorMessageResourceTypeを使用してリソースファイルを指定します。

[Required(ErrorMessageResourceName = "RequiredError", ErrorMessageResourceType = typeof(ErrorMessageResource))]

ここに完全な例があります:

public class SomeViewModel
{
    [Display(Name = "Address", ResourceType = typeof(DisplayNameResource))]
    [Required(ErrorMessageResourceName = "RequiredError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    [StringLength(256, ErrorMessageResourceName = "MaxLengthError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    public string Address { get; set; }

    [Display(Name = "Phone", ResourceType = typeof(DisplayNameResource))]
    [Required(ErrorMessageResourceName = "RequiredError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    [RegularExpression("^09([0-9]{9})$", ErrorMessageResourceName = "PhoneLengthError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    public string Phone { get; set; }

    [Display(Name = "Password", ResourceType = typeof(DisplayNameResource))]
    [Required(ErrorMessageResourceName = "RequiredError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    [StringLength(50, MinimumLength = 6, ErrorMessageResourceType = typeof(ErrorMessageResource), ErrorMessageResourceName = "MinxMaxLengthError")]
    public string Password { get; set; }

    [Display(Name = "ConfirmPassword", ResourceType = typeof(DisplayNameResource))]
    [Required(ErrorMessageResourceName = "RequiredError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    [StringLength(50, MinimumLength = 6, ErrorMessageResourceType = typeof(ErrorMessageResource), ErrorMessageResourceName = "MinxMaxLengthError")]
    [Compare("Password", ErrorMessageResourceName = "PasswordConfirmMisMatch", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    public string ConfirmPassword { get; set; }
}

のエラーメッセージMaxLengthError{0} cannot be longer than {1} characterなので{0}、ローカライズされたファイル名{1}に置き換えられ、256属性で指定したに置き換えられます[StringLength(256,...


1
動作するはずですようだから、私は頻繁に提起されますあなたは、この種や質問などのGithub上でこれを投稿することができれば、私は感謝。これをしようとすると...多言語オプションの膨大な数がある
ラーニング

1
@Learning完全な例をgithubに確実に載せます。
Mohsen Esmailpour

Blazorは私のコンテキストに例があまりないので、これは私のような多くのプログラマにとって大きな助けになります...
学習

1

これは以前に尋ねられました:

ViewModelローカリゼーションをBlazorに追加する方法は?

私はFluentValidationを使用する方が良いアプローチになるだろうと提案しました。これがどのように機能するかを示す私のGithubリポジトリへのリンクです。

https://github.com/conficient/BlazorValidationLocalization


私はこの種のソリューションを念頭に置いていましたが、これはそれぞれに2つのモーダルファイルとなり、プロジェクトが大きい場合は管理が困難になります。はい、これは回避策であり、物事を機能させます...
学習

「2つのモーダルファイル」の意味がよくわかりません。それでも、FluentValidationでresxを使用できます。fluentvalidation.net/localizationを
Quango

-1

私はこれを試しませんでした!

asp.netコアの公式ドキュメントでローカライズする方法のセクションがありDataAnnotations たぶん、あなたは、いくつか見つけることが手がかりが


私はasp.netコアを初めて使用しましたが、別のことを試みましたが、この質問を投稿する前に機能しませんでした。自分の例を見て自分で解決策を探しましたが、別のことを試みましたが、私の場合はうまくいかないようです...少し難しい私はasp.net MVCでの経験のないasp.net webformのバックグラウンド出身です...したがって、私の焦点はasp.netコアのRazorページのみに焦点を当てています..見てみましょう
学習
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.