バージョン

テンプレート エンジンの参照の追加

トピックの概要

目的

このトピックでは、インフラジスティックス テンプレート エンジンの使用を開始するために必要な最低限の JavaScript ファイルについて説明します。

前提条件

以下の表に、このトピックを理解するための前提条件として求められる素材をリストします。

概念

  • jQuery、jQuery UI
  • ASP.NET MVC

トピック

このトピックの内容

このトピックは、以下のセクションで構成されます。

概要

必要なリソースへの参照の追加についての概要

この手順では、igTemplating 用の必要なリソースへの参照を追加するための手順について説明します。

要件

次のブロックの例では、参照が正しく動作するために必要な以下のファイル構造を使用しています。

  • jQuery リソースは、Web サイトまたは Web アプリケーションの Scripts という名前のフォルダーに追加されています。
  • Ignite UI for jQuery の JavaScript ファイルは、Web サイトまたは Web アプリケーションの Scripts/ig という名前のフォルダーに追加されています (詳細については、Ignite UI for jQuery で JavaScript リソースを使用トピックを参照してください)。

独自の構造を使用する場合は、Scripts/ig を独自のフォルダー構造で置き換える必要があります。

必要なリソースへの参照の追加

参照の追加の概要

必要なリソースへに参照を追加するには、以下のような方法があります。

  • JavaScript での igLoader の使用
  • リソースの静的なロード
  • インフラジスティックス MVC ヘルパーの参照の使用

JavaScript での igLoader の使用

Ignite UI for jQuery ライブラリのコントロールで必要な JavaScript および CSS リソースの読み込みには、igLoader™ コントロールを使用することをお勧めします。最初に、igLoader スクリプトをページに追加します。

JavaScript の場合:

<script  type="text/javascript" src="Scripts/ig/infragistics.loader.js"></script>

HTML ビューでは、以下のように igLoader のインスタンスを作成する必要があります。

JavaScript の場合:

<script type="text/javascript">
    $.ig.loader({
        scriptPath: "Scripts/ig/",
        resources: "igTemplating"
    });
<script>

リソースの静的なロード

HTML の場合:

リソースの静的なロード
    <script src="scripts/jquery.min.js" type="text/javascript"></script>
    <script src="scripts/ig/infragistics.templating.js" type="text/javascript"></script>

インフラジスティックス MVC ヘルパーの参照の使用

Infragistics.Web.Mvc アセンブリを ASP.NET MVC プロジェクトで参照し、対応する名前空間をビューで参照する必要があります。

詳細については、Ignite UI for jQuery で JavaScript リソースを使用トピックを参照してください。

名前空間を参照するためのコードを以下に示します。

ASPX の場合:

<%@ Import Namespace="Infragistics.Web.Mvc" %>

MVC ビューでは、igLoader MVC ヘルパーを使用する必要があります。

ASPX の場合:

<script  type="text/javascript" src="Scripts/ig/infragistics.loader.js"></script>
<%= Html.Infragistics().Loader()
       .ScriptPath(Url.Content("~/Scripts/ig/"))
       .Resources("igTemplating")
       .Render()
%>

関連コンテンツ

トピック

このトピックの追加情報については、以下のトピックも合わせてご参照ください。

  • テンプレート エンジンの概要: このトピックでは、igTemplate エンジンによって開発者に公開されているオプションと機能の概要について説明します。

オンラインで表示: GitHub