レンダリングスクリプト - ASP.NETコアでスクリプトがロードされた後のセクションPartialView

Question

ASP.NETコアアプリケーションでは、ウィジェットを使用したダッシュボードがあります。すべてのウィジェットは、独自のPartialViewsを持っていますので、全ページには、次のようにして生成されます。

-Layout.cshtml

--Dashboard.cshtml

--- Widget1.cshtml

- - Widget2.cshtml

高速ページの読み込み時間によるベストプラクティスに従って、JavaScriptはLayout.cshtmlの終了タグ</body>より前に読み込まれます。その後、ページロード時にオブジェクトを開始するためによく使用するカスタムJS用のセクションがあります。したがって、このセクションでは、次のようになります。レイアウトとしてLayout.cshtmlを使用している私の見解で

<script asp-append-version="true" type="text/javascript" src="~/clientscript/page.min.js"></script> 
@RenderSection("Js", required: false) 

、（この例では、そのDashboard.cshtml）、私は

@section Js { 
    // Js Code here 
} 

のようなセクションを定義することができます

は、すべてのスクリプトファイルを含むスクリプトタグの後にレンダリングされます。だから、jQueryやカスタムクラスのようなすべての依存関係がここで使用可能であることは確かです。

しかし、私はまた、たとえばWidget1.cshtmlのようなウィジェットでこれを行う必要があります。問題は、PartialView Widget1.cshtmlをDashboard.cshtmlにロードすることです。 documentation is writtenでは、これは不可能です：

パーツビューでレイザーセクションを宣言すると、そのパーツは親から見えなくなります。部分ビューに限定されます。

しかし、それは私が必要とするものです。この制限を回避する方法はありますか？まもなく、PartialViewからLayoutViewにJavaScriptを挿入し、それらの間に通常のViewを配置することを目標にしています。

私が知っている唯一の方法は、50msのような低い間隔でsetInterval（）を使用し、jQueryやカスタムクラスのいくつかがループ内で定義されているかどうかをチェックすることです。そのJSソリューションはい。しかし、セクションの使用をせずに、PartialViewにスクリプトブロックを直接含めることができます。 jQueryのような単一の変数に依存している場合はうまくいきます。

しかし、私はカスタムクラスがロードされるのを待つ必要があります。それらはjQueryの後に含まれています。したがって、waitForTypeLoaded(type, callback)のような汎用関数を書くことはできません。それは私には常に生のsetInterval（）コードを書くようになりますが、それは私にとって賢明な解決策ではないようです。

Answer 1

正直言って、もしあなたがこのようなジレンマを持っていたら、もう一度建築を見てみましょう。

主なレイアウトに対していくつかのビュー/部分的なビューで使用される必要なスクリプトを追加しないのはなぜですか？ ASP.NET MVCでは、バンドルメカニズムを使用することができます（または独自に記述することもできます）。それは重くはありません...

あなたのアプローチは不要複雑に見えます。

Answer 2

Jqueryが完了した後にスクリプトを実行するために何かしたのですが、部分ビューとコンポーネントの読み込みでした。ページロードが完了した後、すべてのjQuery jsスクリプトをロードするために "DOMContentLoaded"イベントを使用しました。こうすることで、jQueryの読み込みを延期し、jQueryコードをページに残すことができます。

<script> 
    window.addEventListener('DOMContentLoaded', 
     function() { 
      $('body').... 

     }); 
</script> 

Answer 3

この投稿への私の答えで述べたようにあなたの問題を解決することができます。 How to render scripts, generated in TagHelper process method, to the bottom of the page rather than next to the tag element?

要約すると、あなたがタグヘルパーのペアを作成することができ、部分図に配置することができるものとそのコンテンツを一時的な辞書に格納し、もう1つはコンテンツを適切な位置（レイアウトページなど）にレンダリングするだけです。私は、動的に作成された小さなスクリプトをボディの最終的なスクリプトとしてレンダリングするために幅広く使用します。

希望します。