标签: blazor-server-side

Blazor:如何开始随时间循环?示例 - 2 分钟后生成一个问题

我有 10 个问题,有多个答案。我想每 2 分钟后生成一个新问题。并且还向用户显示每个问题的时间。我怎样才能实现这个目标?

我无法显示时间

<div>
    <h2> Time left : @*Here I want to show Time*@ </h2>
</div>

<div class="row">
    @if (id != 0)
    {
         @*This is Question Component & Here I pass the Question id *@
        <QuestionCard Id="@id.ToString()"></QuestionCard>
    }
    else
    {
        <MatH1>Loading . . . . .</MatH1>
    }
</div>


@code {


    System.Timers.Timer aTimer = new System.Timers.Timer();
    private int id { get; set; } = 0;
    protected override async Task OnInitializedAsync()
    {
        await Task.Run(() => Start());

    }
    void Start() …
Run Code Online (Sandbox Code Playgroud)

c# asp.net-core blazor blazor-server-side

2
推荐指数
1
解决办法
3030
查看次数

如何在 blazor 组件中显示来自后端的自定义引导警报

我创建了一个简单的表单,可以填写并保存到数据库,但我不知道如何在 blazor 组件中实现任何类型的成功消息。这是我的表格:

<EditForm Model=@Input OnValidSubmit="Speichern">
    <DataAnnotationsValidator />
    <ValidationSummary />
    <div class="form-row">
        <div class="form-group col-md-6">
            <label>Vorname</label>
            <InputText class="form-control" @bind-Value="Input.FirstName" />
            <ValidationMessage For="() => Input.FirstName" />
        </div>
        <div class="form-group col-md-6">
            <label>Nachname</label>
            <InputText class="form-control" @bind-Value="Input.LastName" />
            <ValidationMessage For="() => Input.LastName" />
        </div>
    </div>
    <div class="form-group">
        <label>Username</label>
        <InputText class="form-control" @bind-Value="Input.Username" />
        <ValidationMessage For="() => Input.Username" />
    </div>
    <div class="form-group">
        <label>E-Mail</label>
        <InputText class="form-control" @bind-Value="Input.Email" />
        <ValidationMessage For="() => Input.Email" />
    </div>
    <div class="form-group">
        <label>Telefonnummer</label>
        <InputText class="form-control" @bind-Value="Input.PhoneNumber" />
        <ValidationMessage For="() => Input.PhoneNumber" />
    </div> …
Run Code Online (Sandbox Code Playgroud)

c# asp.net-core blazor blazor-server-side

2
推荐指数
1
解决办法
4600
查看次数

使用 EF Core 配置 Serilog ASP.Net Core 3.2 来记录 SQL 语句

以前,当使用时,Microsoft.Extensions.Logging我会注入,ILoggerFactory并且.UseLoggingFactory()在设置我的 DbContext 时,如下所示(为了简洁而减少);

    private readonly ILoggerFactory LoggerFactory;


    public Startup(... ILoggerFactory loggerFactory)
    {
        LoggerFactory = loggerFactory ?? throw new ArgumentNullException(nameof(loggerFactory));
    }

    public void ConfigureServices(IServiceCollection services)
    {
        var connectionString = Configuration.GetConnectionString($"DbDataContext");

        services.AddDbContext<OakfieldLeasingDataContext>(
            options => options
                .UseSqlServer(
                    connectionString,
                    x => x.UseNetTopologySuite())
                .UseLoggerFactory(LoggerFactory));
     }
Run Code Online (Sandbox Code Playgroud)

我现在正在尝试换入Serilog,我已成功更改Program.cs如下;

    public static void Main(string[] args)
    {
        Log.Logger = new LoggerConfiguration()
        .MinimumLevel.Debug()
        .MinimumLevel.Override("Microsoft", LogEventLevel.Information)
        .Enrich.FromLogContext()
        .WriteTo.Console(new RenderedCompactJsonFormatter())
        .WriteTo.File(new RenderedCompactJsonFormatter(), "./logs/log.ndjson")
        .CreateLogger();

        try
        {
            Log.Information("Starting up");
            CreateHostBuilder(args).Build().Run();
        }
        catch (Exception ex) …
Run Code Online (Sandbox Code Playgroud)

c# serilog entity-framework-core blazor-server-side

2
推荐指数
2
解决办法
1万
查看次数

Blazor:计算 Blazor 文本区域中的字符(不是 .js)

我有一个输入 textarea,我正在限制(完成)的字符数,我还想提供有关剩余字符数的视觉反馈。这是我的文本区域:

<textarea type="text" name="TheNameOfMyField" class="TheNameOfMyClass" value="" rows="2" maxlength="255"></textarea>

我可以在 .js 中做到这一点,没问题,但这种情况需要一个本地解决方案,尽管我很喜欢“答案”,但同样欢迎指向资源的手指使我能够提出更少的问题 - 只是不是官方的 MS 文档,我需要以在新环境中工作的 UI 开发人员可以理解的级别编写它::grin::

此外,如果有人想权衡 Blazor UI 框架(以至于他们可能能够帮助自动化这样的任务 - 这是我无法在网上找到至少部分答案的第一个),我有购买一个的预算,但我没有时间测试几个,所以我目前没有(没有在 Blazor 工作的联系人,我认识的每个人都是 C++、.JS、PHP 等)

如果我对我的目标不够清楚,这不是我(它是 .js 并且我需要 ac# Blazor 解决方案),但从概念上讲它非常接近(除非我将限制该字段中的字符数,所以没有负数)

https://www.itrelease.com/2011/05/count-characters-in-text-area-using-javascript/'

干杯!

blazor blazor-server-side

2
推荐指数
1
解决办法
986
查看次数

为 Blazor(服务器)InputTextArea 设置行属性

我正在构建一个包含 InputTextArea 的 Blazor(服务器)EditForm。默认情况下,InputTextArea 看起来像创建了一个包含 2 行的 textArea,但对于这个特定的应用程序,我更喜欢 4 行。

如何设置 Blazor InputTextArea 的行数?

razor blazor blazor-server-side

2
推荐指数
1
解决办法
1025
查看次数

最外面的 CascadingValue 在页面刷新或直接链接时丢失

我想在我的 Blazor 应用程序中共享几个组件。这些恰好是 SyncFusion 组件 - 一个是 SfToast,一个是 SfDialog。我认为一个简单的方法是将组件放在 MainLayout.razor 上,然后使用<CascadingValue>每个组件将引用传递给所有子页面和组件。

只要通过<NavLink>元素或使用导航到页面就可以正常工作NavigationManager.NavigateTo()。但是,如果页面被深层链接或刷新,则最外层<CascadingValue>将变为空。为了解决这个问题,我创建了一个额外的虚拟对象<CascadingValue>作为最外层,以确保我真正关心的值填充在刷新或直接链接上,但这感觉就像一个黑客。我想知道我这样做的方式是否存在本质上的错误,导致最外层<CascadingValue>在刷新时变为空。

下面是一些示例代码来说明问题。这是非常做作的,但这是我能找到的创建一个最小的可重现示例来显示问题的唯一方法。

如果运行该项目并单击“转到示例页面”按钮,您将看到 CompOne 和 CompTwo 组件引用均已按预期设置为值。但是,如果您随后刷新页面,您将看到 CompOne 引用(最外面的<CascadingValue>)现在为空。

项目的布局如下(从默认的 Blazor Server 模板创建,因此我只显示了我进行修改的区域):

+ Blazor 示例
| + 组件(我添加了这个文件夹)
  | - ComponentOne.razor
  | - ComponentTwo.razor
| + 页数
  | - 索引.剃刀
  | - SamplePage.razor
| + 共享
  | - MainLayout.razor

MainLayout.razor

@inherits LayoutComponentBase

<div class="sidebar">
    <NavMenu />
</div>

<div class="main">
    <div class="top-row px-4"> …
Run Code Online (Sandbox Code Playgroud)

syncfusion blazor blazor-server-side

2
推荐指数
1
解决办法
1649
查看次数

将参数传递给 Blazor 组件

我想不出如何实现以下目标:

我需要将参数集合(或数组)传递给 Blazor 组件。传递的参数是 Blazor 组件。参数集合必须作为嵌套标签传递。必须能够分别调用每个传递的参数组件的渲染。

也就是说,我想要这样的东西:

<MyComponent>
  <ParameterCollection>
    <MyParameterComponent1>Caption1</MyParameterComponent1>
    <MyParameterComponent2>Caption2</MyParameterComponent2>
    <MyParameterComponent3>Caption3</MyParameterComponent3>
  </ParameterCollection>
</MyComponent>
Run Code Online (Sandbox Code Playgroud)

我的组件代码:

@code{
    [Parameter]
    public RenderFragment[] ParameterCollection {get; set;} //Runtime error
}
Run Code Online (Sandbox Code Playgroud)

我想要得到的显然是在这里实现的商业 Blazor 组件(选择 VIEW SOURCE 选项卡)。GridColumns 参数被传递到 GridColumn 组件的集合。更准确地说,在我看来,它是它们对应的 RenderFragment 的集合。问题是它是如何完成的?

c# asp.net-core blazor blazor-server-side blazor-client-side

2
推荐指数
2
解决办法
2321
查看次数

如何在 Blazor 服务器端 razor 组件中导入 IConfiguration?

我有一个 razor 组件,我想使用我的 appsettings.json 文件中的配置值,我已经按照这里的示例进行操作:Inject an IConfiguration

但这对我来说在 @code 块中不起作用。

到目前为止,我的剃须刀组件如下所示:

@using Microsoft.Extensions.Configuration
@inject IConfiguration Configuration

@code {
    private string strValue = Configuration.GetSection("MySection").Value;
}
Run Code Online (Sandbox Code Playgroud)

我在 Configuration.GetSection 行上收到以下错误:

字段初始值设定项不能引用非静态字段、方法或属性“MyComponent.Configuration”

我显然可以在 @code 部分之外使用 @Configuration 而不会出错。

我错过了什么吗?我无法找到与此确切问题相关的帖子,如果这是重复的,请见谅。

c# blazor blazor-server-side

2
推荐指数
1
解决办法
948
查看次数

Blazor 应用程序中的结构以及为什么我不能拥有一个?

因此,我使用dotnet new blazorserver. 在VS中打开解决方案并运行它。

美好的。

如果我添加一个新文件夹,Components并在该文件夹中添加一个新的 Razor 组件 -Component1.razor那么在我的index.razor页面中,我添加一条 using 语句来指向我的Components文件夹,并添加标记以包含组件本身并运行应用程序、索引页面显示,但没有我的组件的迹象。进一步查看渲染的 HTML 的源代码,我看到一个空元素<component1></component1>

如果我将新组件移至该Pages文件夹并重新运行应用程序,该组件将正确呈现。

如果我在下面创建一个子文件夹Pages并将组件移到那里并重新运行应用程序,则该组件将无法渲染。

难道我做错了什么?我是不是期待太多了?我是否应该能够拥有一个结构,这意味着我不必将每个组件都放在一个文件夹中?

blazor visual-studio-2019 blazor-server-side

2
推荐指数
1
解决办法
1064
查看次数

将 EditForm 绑定到数组时如何让 EditContext.Validate() 工作

我创建了一个EditForm包装表,如下所示:

**Index.razor**


@using System.ComponentModel.DataAnnotations;

<EditForm @ref="Form" Model="vms" OnSubmit="Submit">
    <DataAnnotationsValidator></DataAnnotationsValidator>
    <table class="table">
        <thead>
            <tr>
                <th>Code</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var vm in vms)
            {
                <tr>
                    <td>
                        <InputText @bind-Value="vm.Code"></InputText>
                        <ValidationMessage For="@(() => vm.Code)"></ValidationMessage>
                    </td>
                </tr>
            }
        </tbody>
    </table>
    <input type="submit" class="btn btn-primary" value="Submit" />
</EditForm>

@code{
    List<MyClass> vms;
    EditForm Form;
    class MyClass
    {
        [Required(ErrorMessage ="Required")]
        public string Code { get; set; }
    }
    protected override void OnInitialized()
    {
        vms = new List<MyClass>()
    {
            new MyClass()
            {
                Code = "1111"
            }, …
Run Code Online (Sandbox Code Playgroud)

blazor blazor-server-side

2
推荐指数
1
解决办法
646
查看次数