web-dev-qa-db-ja.com

部分ビューを非同期的にレンダリングする方法

部分ビューを非同期でレンダリングできますか？

ブログ投稿をレンダリングする必要がある部分的なビューがあります。ブログの投稿は非同期で返されます。

私の_Layoutファイル部分フッターをレンダリング_Footer。 _Footer次のマークアップがあります。

@Html.Action("FooterLatestBlogPosts", "Common")

したがって、私のCommonコントローラーには、次のアクションメソッドがあります。

public async Task<ActionResult> FooterLatestBlogPosts()
{
     List<ArticleDTO> articleDTOs = await articleTask.GetAllAsync();

     return PartialView(articleDTOs);
}

私のFooterLatestBlogPosts部分ビューには、次のものがあります。

@model List<MyProject.Application.DTO.ArticleDTO>
@if (Model.Count > 0)
{
     <ul class="list-unstyled">
          @foreach (var articleDTO in Model)
          {
               <li>@articleDTO.Title</li>
          }
     </ul>
}

エラーが発生しています：

Error executing child request for handler 'System.Web.Mvc.HttpHandlerUtil+ServerExecuteHttpHandlerAsyncWrapper'

データを戻すために同期モードを作成する必要がありますか？

c#asp.netasp.net-mvcasp.net-mvc-4razor
22
Brendan Vogt

私は@buffjapeが示唆した投稿の答えに行きました：

非同期PartialViewにより「HttpServerUtility.Execute blocked ...」例外が発生します

メソッドをすべて同期に変更しました。

7
Brendan Vogt

まず、@ buffjapeで提案されているように_Html.Partial_を使用する必要があります。部分ビューがSharedフォルダーにない場合は、ビューへのパスを指定する必要があります

@Html.Partial("~/Views/Common/FooterLatestBlogPosts", yourModel)

ただし、この場合、ビューは引き続き同期的にロードされます。非同期で読み込むには、jQueryを介して読み込む必要があります。記事 非同期の部分ビューを使用したASP.NET MVC Webサイトの知覚パフォーマンスの改善 は、その達成方法について非常に優れた説明を提供します。

また、_Html.Render_を

_$(document).ready(function(){
     $("#yourContainer").load('@Url.Action("FooterLatestBlogPosts", "Common")')
});
_
33
Andrei Mihalciuc