Динамически генерируемые строки таблицы Blazor - PullRequest
2 голосов
/ 16 июня 2020

Я создал образец приложения c# Blazor (серверного), чтобы немного попрактиковаться. Я пытаюсь динамически генерировать строки таблицы для календаря, но столкнулся с проблемой.

<table class="table">
    <thead>
        <tr>
            <th>Monday</th>
            <th>Tuesday</th>
            <th>Wednesday</th>
            <th>Thursday</th>
            <th>Friday</th>
            <th>Saturday</th>
            <th>Sunday</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            @* currentDateTimeValues is a list with DateTime objects *@
            @foreach (var item in currentDateTimeValues)
            {
                @if (counter % 7 == 0 && counter > 0)
                {
                    @:</tr><tr>
                }
                counter++;
                <td>@item.ToString("dd.MM.yyyy")</td>
            }
        </tr>
    </tbody>
</table>

После 7 ячеек должна быть создана новая строка, но этого не происходит. Ячейки go прямо без разрыва строки.

rows going straight ahead

Может у вас есть какие-нибудь идеи.

ОБНОВЛЕНИЕ: Тем временем я создал обходной путь, потому что думаю, что blazor не может обрабатывать </tr><tr> My currentDateTimeValues-List теперь содержит объекты недели

        <tbody>
            @* currentDateTimeValues is a list with Week objects *@
            @foreach (var week in currentDateTimeValues)
            {
            <tr>
                <td>@week.Monday</td>
                <td>@week.Tuesday</td>
                <td>@week.Wednesday</td>
                <td>@week.Thursday</td>
                <td>@week.Friday</td>
                <td>@week.Saturday</td>
                <td>@week.Sunday</td>
            </tr>
            }
        </tbody>

1 Ответ

1 голос
/ 16 июня 2020

Я думаю, что решение, которое вы пытаетесь использовать, в данный момент невозможно в Blazor. Почему бы не использовать две петли для создания календаря. Что-то вроде:

@while (counter < currentDateTimeValues.Length)
{
    <tr>
       @{
            var i = 0;
            if (i < 7 && counter + i < currentDateTimeValues.Length)
            {
                <td>@currentDateTimeValues[counter + i].ToString("dd.MM.yyyy")</td>
                i++;
            }
        }
    </tr>
    counter += 7;
}
...