วิธีการ Localize ข้อความตรวจสอบ (DataAnnotationsValidator) ในฝั่งเซิร์ฟเวอร์ blazor


10

ฉันใช้ blazor 3.1 ใน VS 2019 เวอร์ชันล่าสุด

จนถึงตอนนี้ฉันสามารถ จำกัด เลเบลหน้า (ชื่อเรื่อง, เขตข้อมูลตาราง ฯลฯ .. )

ในListEmployee.razorหน้าฉันสามารถแปลส่วนหัวของตาราง ฯลฯ และในAddEmplyeeValidation.razorหน้าฉันสามารถ จำกัด รูปแบบป้ายชื่อ แต่ฉันมีปัญหาในการแปลข้อความตรวจสอบ

สำหรับข้อความการEmployee.csตรวจสอบความถูกต้องสำหรับข้อความการตรวจสอบความถูกต้องจะกำหนดไว้ในไฟล์ & Resources/Dataโฟลเดอร์นี้โดยใช้ชื่อที่กำหนดData.Employee.ar.resxและData.Employee.ar.resxนี่ไม่ทำงาน

ใช้ System.ComponentModel.DataAnnotations;

namespace BlazorSPA1.Data {พนักงานระดับสาธารณะ {[MaxLength (50)] สตริงสาธารณะรหัส {รับ; ตั้ง; }

    [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.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/

รูปภาพโครงสร้างโฟลเดอร์สำหรับ refrence

ป้อนคำอธิบายรูปภาพที่นี่

ตัวอย่างไฟล์ทรัพยากรสำหรับเวอร์ชันภาษาอังกฤษในลักษณะเดียวกันฉันมีไฟล์ภาษาอาหรับด้วย

ป้อนคำอธิบายรูปภาพที่นี่

ในภาพด้านล่างคุณจะถูกดึงชื่อฟิลด์จากไฟล์ทรัพยากร แต่สำหรับข้อความการตรวจสอบความถูกต้องจะแสดงเป็นภาษาอังกฤษว่าไม่ทำงาน

ป้อนคำอธิบายรูปภาพที่นี่

คำตอบ:


7

นี่คือวิธีแก้ไขข้อความแสดงข้อผิดพลาดคำอธิบายประกอบในการแปลเป็นภาษาท้องถิ่น ฉันสร้างไฟล์ทรัพยากรสองไฟล์หนึ่งรายการสำหรับฟิลด์และอีกไฟล์หนึ่งสำหรับข้อความแสดงข้อผิดพลาด

  • 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
@ เรียนฉันจะใส่ตัวอย่างที่สมบูรณ์ใน GitHub แน่นอน
Mohsen Esmailpour

นี่จะเป็นความช่วยเหลือที่ยอดเยี่ยมสำหรับโปรแกรมเมอร์จำนวนมากเช่นฉันเนื่องจาก Blazor ไม่มีตัวอย่างมากในบริบทของฉัน ...
การเรียนรู้

1

สิ่งนี้ถูกถามมาก่อน:

วิธีการเพิ่มการแปล ViewModel ให้กับ Blazor

ฉันแนะนำว่าการใช้ FluentValidation จะเป็นวิธีที่ดีกว่า นี่คือลิงค์ไปยัง repo Github ของฉันที่แสดงให้เห็นถึงวิธีการทำงาน:

https://github.com/conficient/BlazorValidationLocalization


ฉันมีวิธีแก้ปัญหาแบบนี้อยู่แล้ว แต่ไฟล์สองไฟล์นี้จะเป็นไฟล์ modal สำหรับแต่ละโครงการและถ้าโครงการมีขนาดใหญ่มันจะยากต่อการจัดการใช่นี่เป็นงานที่ต้องทำและทำให้ทุกอย่างทำงาน ...
เรียนรู้

ไม่แน่ใจว่าสิ่งที่คุณหมายถึง "สองไฟล์กิริยา" คุณยังสามารถใช้ resx กับ FluentValidation ดูfluentvalidation.net/localization
Quango

-1

ฉันไม่ได้ลองสิ่งนี้!

ในเอกสารอย่างเป็นทางการของแกน asp.net มีส่วนวิธีการที่จะ จำกัด วงDataAnnotations บางทีคุณอาจจะพบบางปมมี


ฉันใหม่กับแกน asp.net ฉันลองสิ่งที่แตกต่างกัน แต่ไม่ได้ทำงานก่อนโพสต์คำถามนี้ฉันพยายามหาวิธีแก้ปัญหาด้วยตัวเองดูตัวอย่างลองสิ่งที่แตกต่าง แต่มันดูเหมือนจะไม่เหมาะกับกรณีของฉัน ... มันยากหน่อย ฉันมาจากพื้นหลังเว็บฟอร์ม asp.net ที่ไม่มีประสบการณ์ใน asp.net MVC ... ดังนั้นฉันจึงมุ่งเน้นไปที่หน้า asp.net หลักของมีดโกนเท่านั้น .. ให้เราดู
การเรียนรู้
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.