問題タブ [angular-template]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
20207 参照

angularjs - Angularjs templateUrl ファイルの場所が見つかりません

シングルページアプリをローカルで開発しています。

Angularjs で単純なカスタム ディレクティブを使用して HTML ファイルをテンプレートとして読み込めないようです。属性を使用して生の html を使用しようとするとtemplate:、問題なく動作しますが、このテンプレートで使用する必要があるコードは 400 行以上あり、templateUrl:何も使用しないとすぐに読み込まれます。HTMLファイルをC:/ my-customer.htmlなどのさまざまな場所にコピーするなど、30の可能なパスを試してみました。これが私のプロジェクト構造です。

簡単にするために、Angular ドキュメントの例を使用しています。ここでは、ディレクティブのコードを示します (コントローラーを含む main.js 内)。

などのパスをもう一度試し../my-customer.html ../templates/my-customer.htmlましたが、何も機能していませんtemplateUrl:。これが役立つ場合は、ローカル Web サーバーが実行されていない Windows を使用しています。

ここにいくつかのコンソールエラーがありますが、初心者としてその意味がわからないので、Webサーバーを実行してhttpを解析する必要があると感じています。

Angularjs は初めてです。私はプロジェクトで壁にぶつかり、今は完全に立ち往生しています。

0 投票する
1 に答える
1341 参照

javascript - 1つのディレクティブを持つAngularJsの複数のテンプレートビュー

コードの例を見て、必要な機能を満たすように編集しました。

http://jsfiddle.net/infnadanada/abr5h5we/で見ることができます

問題は、「uiwidget」ディレクティブで 2 つ (またはそれ以上) のオブジェクトを初期化すると、2 つのオブジェクトが最後に渡された値を返すことです。

これを修正する方法、または属性 (+ ご覧のとおり他の属性) を使用して $templateCache をディレクティブに渡すことができる他のコードはありますか?

HTML

角度のある

PD: 私は Angular を初めて使用し、下手な英語で申し訳ありません:D ありがとう!

0 投票する
1 に答える
3381 参照

angularjs - 動的に生成された入力フィールドを持つ Angular ディレクティブが検証を表示できない

3 日間、stackoverflow や他のサイトを精査した後、私は振り出しに戻りました。

私の仕事: 動的に生成されたフォーム フィールドを検証する必要があります。

HTML:

コントローラー:

ディレクティブ:

ディレクティブの外側のフォーム フィールドにアクセスできず、ディレクティブ内のフォーム名にアクセスできないため、明らかにスコープの問題があります。また、 $scope.myForm.name プロパティを角度バインディング式にすることはできませんが、機能するように書き換える方法がわかりません。

これは jsfiddle です: http://jsfiddle.net/scheedalla/57tt04ch/

どんなガイダンスもとても役に立ちます、ありがとう!

0 投票する
1 に答える
631 参照

javascript - $templateCached したにもかかわらず、Angular はまだテンプレートを探しようとしています

gulpangular ngbp、およびをマージしようとしていionicます。これまでのところ、サンプル アプリ コードを ngbp スタイルに再構築し、テンプレートをjsファイルにコンパイルして、テンプレートを にロードできるようにしました。これにより$templateCache、アプリjsファイルはキャッシュからテンプレートを取得できるようになりました。

私の中でindex.html

私の中でtemplates-app.js

サンプル ルート (browse/routes.js)、テンプレートがsrc/app/browse/templates/含まれています (テンプレートはビルドに含まれていないため、テンプレートをキャッシュするには templates-app.js が必要です)

これは通常、一般的なngbpプロジェクトでは正常に機能しますが、何らかの理由でlocalhost:8080、プロジェクトをロードすると、angularアプリは引き続きGETテンプレート ファイル (404) を試行します。アプリがキャッシュを使用しないのはなぜですか?

0 投票する
2 に答える
6740 参照

javascript - $http 呼び出しで {cache: $templateCache} を設定しましたが、ディレクティブで $templateCache が未定義です

私は 2 つの HTML ページsnippet1.html&を持っていsnippet2.htmlます。ディレクティブ内でそれらを使用したい。単一のディレクティブを使用して複数のテンプレートを追加するためです。

<script>タグ内にhtmlテンプレートを追加して、以下のように指定して、このことを試しましたtype="text/ng-template"

そして、私は使用します$templateCache.get('snippet1.html')。この実装は正常に機能しています。

しかし、私の場合はhtml自体からロードする必要があるため、テンプレートをajaxでロードしてmakeすることにしました$http cache: $templateCache

ワーキング JSFiddle

実行ブロック

しかし、私のコントローラーの内部$templateCache.get('snippet1.html')は未定義です。

私の質問は、<script>' tag & Why it don't work when I html inside$templateCache while making$http` ajax 呼び出し内でテンプレートを宣言しているときに機能するのはなぜですか?

問題のあるPlunkr

誰でもこの問題で私を助けることができますか? または、コードに何か不足しています。

助けていただければ幸いです。ありがとう。

0 投票する
1 に答える
4674 参照

angularjs - Angular JS ng-include バインディングの問題

HTML ページで 2 回使用しているテンプレート ファイルを使用してページャー ウィジェットを作成しました。ページに移動するオプションを選択し、前のページと次のページへのリンクもあります。

問題は、選択ボックスを使用して現在のページを更新し、次に前と次のページのリンクを使用すると、現在のページは更新されますが、選択ボックスは更新されません。

私が間違っていることを教えてください。このようなページャー ウィジェットを構築するための私のアプローチに論理的な間違いはありますか?

コントローラーコード:

問題を再現するための plnkr の URL は次のとおりです。

http://plnkr.co/edit/9LUJnVzWAS9BauyORQn5?p=preview

0 投票する
1 に答える
430 参照

angularjs - Angularjs では、複数のディレクティブの動的テンプレート形成とコンパイル コードをコントローラーからカスタム ディレクティブに移動するための最適なソリューションが必要です

タブをクリックすると、単一のページに複数の angularjs ディレクティブを表示する必要があります。これは、c3 チャート ディレクティブと ng グリッド ディレクティブの組み合わせである可能性があります。コントローラーでこれらすべての関連パラメーターを使用してモデルを準備し、テンプレートを作成してから、コントローラー自体でコンパイルします。これは完全に正常に機能しています。コントローラーで DOM 操作を行うのは良い方法ではないことに気付いたので、カスタム ディレクティブでそれを実行しようとしています。

このディレクティブは、次の機能をサポートする必要があります。

  1. テンプレートは、C3 チャート ディレクティブの組み合わせである必要があります。
  2. テンプレートには、c3 チャート ディレクティブと共に Angularjs ng Grid ディレクティブも含めることができます。
  3. 将来的には、C3 chart および ng grid ディレクティブと共に Good Map ディレクティブも使用したいと考えています。
  4. また、これらのディレクティブの一部は、カスタム ドロップダウンでサポートする必要があります。

今のところ、完全に正常に動作しているコントローラーで次のコードを使用しました。

簡単にするために、いくつかのサンプルコードのみを提供しました。dashletteId に基づいて、dashletteId に基づいてテンプレートを動的に作成するための特定の要件がいくつかあります。このコードはすべて完全に機能しています。今、私の目的は、このすべてのテンプレート形成とコンパイル コードをコントローラーからカスタム ディレクティブに移動することです。これに対する最善の解決策を探しています。

特定のユーザーが任意のタブをクリックすると、コンパイルのためにどのテンプレートを作成する必要があるかが事前定義されています。したがって、ng-init関数呼び出しまたはタブのクリック(つまり、選択)関数呼び出しのいずれかでそれを取得できます。

以下は、私の ng グリッド テンプレート形成のサンプル コードです。

したがって、1 つのページに 4 つのディレクティブを表示する必要があります。ユーザーが事前に定義した選択に基づいて、3 つの c3 チャートと 1 つの ng Grid テーブル ディレクティブ、または 2 つの C3 チャートと 2 つの ng グリッド テーブルなどを表示する必要があります。

以下は、これにさらに取り組む前のカスタム ディレクティブの予備的なコードです。より良いアプローチのために、他のユーザーからの情報を取得することを考えました。ここで私のリンク関数では、タブのクリックまたは ng-init フェーズなどでコントローラーから動的に取得する必要があるテンプレートを使用します。

私の質問に対してさらに明確にする必要がある場合はお知らせください。指示があれば、サンプルコードを添えてください。

0 投票する
1 に答える
973 参照

angularjs - Angularjs のカスタム ディレクティブのコントローラーの ng-init 関数呼び出しからテンプレートを取得する必要があります

angularjs ディレクティブの初心者として、私は少し混乱しています。誰でも次のことで私を助けることができますか. 以下は私のカスタムディレクティブです。

テンプレートを のようにしたいtemplate = templateFromController。つまり、ディレクティブでテンプレートをハードコーディングしたくありません。むしろ、ng-init関数の呼び出し中にコントローラーでテンプレートを作成したいと思い、ディレクティブでそのテンプレートを使用したいと考えています。どうすればいいですか?

したがって、私のコントローラーでは、次のようなものがあります。

また

コントローラーの ng-init 関数呼び出しの他の基準に基づいて、このようなものをvar templateFromController作成し、カスタム ディレクティブでこの templateFromController をテンプレートに使用するようにします。誰でも私がそれを行うのを手伝ってもらえますか?

@ダニエル、あなたの提案に従って次の変更を加えました:

そしてコントローラーで:

そして私のjspには、次のものがあります。

しかし、それはエラーを出しています:テンプレートはvar linkFn = $compile(template);私のディレクティブの行で定義されていません.