Вызов компонента просмотра внутри частичного просмотра - ASP.NET Core

У меня есть частичное представление ("_FormCustomer"), которое отображает форму для создания клиента. У меня также есть компонент просмотра ("Список стран"), который генерирует список опций стран. Теперь я хочу показать список стран в моей форме. Вот что я делаю:

Index.cshtml

<partial name="_FormCustomer" for="@Model._Customer" />

_FormCustomer.cshtml

<select asp-for="@Model.Land" class="form-control">
    @await Component.InvokeAsync("Countrylist");
</select>

CountrylistViewComponent.cs

public async Task<IViewComponentResult> InvokeAsync()
{
    return View(await _countryRepository.GetCountriesAsync());
}

(функция GetCountriesAsync возвращает список стран, это прекрасно работает)

Страницы /Componenst/CountryList/default.cshtml

@model List<Country>
@foreach (Country country in Model)
{
    <option value="@country.code">@country.name</option>
}

К сожалению, поле выбора остается пустым, когда я вызываю частичное. Когда я звоню @await Component.InvokeAsync("Countrylist"); прямо из Index.cshtml он отлично работает.

Похоже, вы не можете использовать компонент View внутри частичного представления. Правильно ли сделан этот вывод? Или я что-то не так делаю?

2 ответа

Спасибо Phantom2018, нашел проблему после вашего поста.

@ 0: я использую страницы бритвы

@1: это не имело никакого эффекта

@2: это была опечатка в моем вопросе, а не в моем коде

@3: отладчик показывает мне, что вызывается компонент vie, поэтому

Мой настоящий код немного отличается, я хочу предварительно выбрать страну, если она доступна:

<select asp-for="@Model.Country" class="form-control">
    @if (Model == null)
    {
        await Component.InvokeAsync("Countrylist");
    }
    else
    {
        await Component.InvokeAsync("Countrylist", Model.Country);
    }  
</select>

И после некоторого тестирования я нашел решение:

<select asp-for="@Model.Country" class="form-control">
    @if (Model == null)
    {
        @await Component.InvokeAsync("Countrylist");
    }
    else
    {
        @await Component.InvokeAsync("Countrylist", Model.Country);
    }  
</select>

Не знаю почему, но мне пришлось использовать @предвкушает ждет.

Теперь я проверил этот сценарий и могу подтвердить, что данные загружаются нормально - как при непосредственном включении компонента представления на страницу, так и при частичном просмотре. (Я проверял это на страницах Razor - но, вероятно, он будет работать так же, когда используется MVC. Вы не упомянули, используете ли вы страницы MVC или Razor.)

Несколько вещей, которые вы можете попробовать проверить, нормально ли работает загрузка:

1) Из всех "Select" и "Partials" удалите атрибуты "for*". Таким образом, вы можете сначала проверить, загружаются ли данные, а затем беспокоиться о привязке к выбранному элементу. (Кроме того, в предоставленном вами коде вы пропустили переменные модели - поэтому комментировать их невозможно.)

2) Удалить последний ";" в вашем _FormCustomer.cshtml

<select asp-for="@Model.Land" class="form-control">
    @await Component.InvokeAsync("Countrylist")
</select>

Обратите внимание, что я удалил завершающий ";" в ожидании заявления. Я заметил, что ";" был добавлен в качестве еще одной "опции" в выборе!

3) Я также заметил, что даже незначительные синтаксические ошибки (не обнаруженные I ntellisense) могут привести к тому, что select не загружается. Отладка, чтобы увидеть, действительно ли вызывается I nvokeAsync - в случае, когда произошла небольшая синтаксическая ошибка, I nvokeAsync даже не вызывался.

Также имейте в виду, что:

"Когда создается частичное представление, он получает копию словаря ViewData родителя. Обновления, внесенные в данные в частичном представлении, не сохраняются в родительском представлении. Изменения ViewData в частичном представлении теряются при возврате частичного представления. "

Другие вопросы по тегам