問題タブ [angularjs-compile]

だから私はウェブサイトをセットアップしていて、他の .html ファイルを div に動的にロードしたいと考えています。各 .html ファイルにはいくつかのコンテンツが含まれていますが、1 つの .html ファイルには独自の angularjs ディレクティブが含まれています。

$scope.content = $sce.trustAsHtml(data);とともにng-bind-htmlを使用していました。しかし、これがhtml rawを出力することを発見しました（角度ディレクティブを処理しません）。

スタックオーバーフローでさまざまなソリューションを使用しようとしましたが、うまくいきませんでした。

Web サイト: http://algorithmictrading.azurewebsites.net/

App.js: http://algorithmictrading.azurewebsites.net/js/app.js

読み込まれる .html ページの例: http://algorithmictrading.azurewebsites.net/includes/home.html http://algorithmictrading.azurewebsites.net/includes/about_us.html

angular ディレクティブを含む .html ページ: http://algorithmictrading.azurewebsites.net/includes/download.html

ご覧のとおり、Web サイトに移動して [ダウンロード] タブをクリックすると、コンテンツは読み込まれますが、ドロップダウン メニューの角度は処理されません。追加したテスト ボタンもアラート ボックスを生成する必要があります。

現在、コードは次のスレッドに基づいています: Call function inside $sce.trustAsHtml() string in Angular js

ありがとう！

コントローラーから動的にカスタム ディレクティブを追加しようとしています。ディレクティブを追加するために、次のことを行いました。

カスタム ディレクティブのテンプレートは次のとおりです。

上記は、デモンストレーションのみを目的とした単純化されたサンプルです。

したがって、DOMにディレクティブを正常に追加し、ng-repeat内のすべての機能を実行していますが、テキストボックスに何も入力できないため、ユーザー入力で結果をフィルタリングできません.

この問題を解決するのを手伝ってください。私はまだAngularJSの概念を学んでいるので、単純な間違いかもしれません.

編集私も追加しようとしました

テンプレート内で入力ボックスに入力することはできますが、ng-repeat で「検索」の結果をフィルタリングしていません。

角度パフォーマンスの最適化に関するこの記事を読んでいますが、そこには次の文章があります。

ディレクティブのコンパイル関数は、スコープがアタッチされる前に実行され、DOM 操作 (バインディング イベントなど) を実行するのに最適な場所です。パフォーマンスの観点から認識すべき重要なことは、コンパイル関数に渡される要素と属性が、angular の変更が行われる前の生の html テンプレートを表すことです。これが実際に意味することは、ここで行われる DOM 操作は 1 回実行され、常に伝搬されるということです。よく見過ごされがちなもう 1 つの重要な点は、プレリンクとポストリンクの違いです。簡単に言えば、プレリンクは外側から内側へ、ポストリンクは内側から外側へと伸びています。そのため、プレリンクは、親がプレリンクのスコープを変更するときに、内部ディレクティブが 2 番目のダイジェスト サイクルを実行するのを防ぐため、パフォーマンスがわずかに向上します。

これらの 2 つの部分と、それを使用してパフォーマンスを向上させる方法を理解できません。

これが実際に意味することは、ここで行われる DOM 操作は 1 回実行され、常に伝搬されるということです。

この

プレリンクは、親がプレリンクのスコープを変更するときに内部ディレクティブが 2 番目のダイジェスト サイクルを実行するのを防ぐため、パフォーマンスがわずかに向上します。

誰かがそれについて詳しく説明していただければ幸いです。

カスタムのソーシャル共有ウィジェットにレンダリングする AngularJS ディレクティブがあります。1 日あたり約 10,000 ページ ビューのうち、そのうちの約 1 ～ 2 回で、Angular はディレクティブのコンパイルを開始した後にエラーになります。これにより、未加工の HTML パーシャルが DOM に残り、ユーザーに表示されます。

このエラーを知ったのは、複数のユーザーから報告されたためです。再現することはできませんが、発生していることを示す情報ログを作成しました。

これが発生するたびに：

• ブラウザは常に Chrome
• OS は Mac または Windows
• Angular はコンパイル フェーズを開始しますが、ポスト リンクを開始する前に失敗します
• Angular はコンパイル フェーズ中にエラーを報告しますが、「$exceptionHandler」サービスに渡される「例外」オブジェクトは常に null です。
• その他の JavaScript エラーは報告されていません

このエラーは、複数日にわたって同じ IP の一部で発生しています。

誰かが同様の問題を抱えていましたか？

編集

これが私のコードです...

JavaScript:

HTML:

Angular でボタンを動的に生成しようとしています。クリックすると、そのボタンはdeleteRow()関数を呼び出してユーザー名を渡す必要があります。適切なユーザー名がコントローラーに正常に渡され、結果のボタン コードが適切に生成されたように見えます。ただし、それらのボタンは関数に渡さundefinedれてしまいdeleteRow()ます。これは私の使い方の問題です$compileか？

HTMLは次のとおりです。

基礎となるデータベースのさまざまなメトリックを公開するウィジェットをユーザーが追加できるように、ダッシュボード コンポーネントを構築しています。各ウィジェットは個別のディレクティブです。ダッシュボードでウィジェットのサイズを適切に設定するには、ディレクティブのテンプレートで定義されたプロパティにアクセスする必要がありますが、その方法を見つけるのに苦労しています。

ディレクティブをコンパイルしてウィジェットを追加しています。

これは、ダッシュボード コンテナーに .appended されます。

「w」と「h」の値を設定する必要があり、ウィジェットのディレクティブ テンプレート内にこれらの属性を埋め込んでいます。

問題は、ディレクティブがコンパイルされた後に my-rows と my-cols にアクセスするにはどうすればよいかということです。外部からウィジェットの構成にアクセスするためにウィジェットごとにサービスを定義できることはわかっていますが、これは膨大なオーバーヘッドのようです。

上記の例では、「test」属性には簡単にアクセスできますが、「my-rows」または「my-cols」にはアクセスできません。