0

シンプルな Angular ページ (テンプレートの読み込み以外は xhr なし) を使用しようとしていますが、これまでのところ簡単ではありませんでした

どういうわけか、Firefox がスクリプトを実行して HTML をレンダリングする方法と、XUL が実行する方法に違いがあります。私が知る限り、これらの違いは文書化されていません。なぜなら、リンクがそのunsafe:前にある理由を突き止めるために、過去 1 時間ほど探していたからです。コンテンツが安全でないと見なされているためだと推測できますが、ドキュメントが見つかりません。

メインの HTML ページは XUL ブラウザー要素内にあり、タイプは に設定されcontent-primary、ソースは に設定されていますchrome://myapp/content/index.html

メイン ページと最初に読み込まれたテンプレートの直接リンクは次のように機能します。

<a href='#/students/JON'>link in the template</a>

それをクリックすると、詳細テンプレートが読み込まれ、データが表示されます。

Angular に ng-repeat でリンクを生成させると、もう機能しません。

<a href="#/students/{{student.name}}">{{student.name}}</a>

このリンクの href は次のように変更されます。unsafe:chrome://myapp/content/index.html#/students/JON

また、次のように変更されます。

<a href='#/students/{{"JON"}}'>messed with by angular</a>

これは、JS で生成された href が安全ではないと見なされていることを示唆していますが、以下は正常に機能します。

  var a=document.createElement("a");
  a.href="#/students/JON";
  a.innerHTML="dynamic added link same url";
  document.body.appendChild(a);

そのリンクをクリックすると、詳細テンプレートが読み込まれ、詳細が表示されます。

私の質問は、どうすれば XUL がリンクを安全でないと見なすのを防ぐことができるでしょうか? それらはすべてローカルリソースを指してchrome://myapp/content/おり、リンクを機能しchrome://myapp/content/index.html#/sudents/JONていないように設定しています(まだ安全ではありません)。

もう 1 つは、XUL レンダリングの方法と Firefox とは異なる方法で JS を実行する方法についての優れたドキュメントはありますか? そのようなドキュメントがある場合、それには安全でない部分と、おそらく私が遭遇する可能性のある他のものが含まれていることは間違いありません。

[更新] Maier 氏のおかげで、これは XUL の問題ではないことがわかりました。以前は XUL がクロム コンテンツの location.replaceState を拒否し、(Firefox のように) 200 ではなくステータス 0 を返していたので、これも XUL 関連であると想定しました。dom 要素の追加が機能し (angular は私がそれらを追加したことを認識していませんでした)、Angular によって処理されなかったリンクが機能したため、それが Angular であることを知っていたはずです。chrome:// プロトコルを信頼済みとして追加するには、次のことを行いました。

angular.module('student', []).
  config(['$routeProvider','$compileProvider', 
    function($routeProvider,$compileProvider) {
      $compileProvider.urlSanitizationWhitelist(/^\s*(chrome|file):/);

現在、Firefoxでディスクからファイルを開いてすべてがまだ機能するかどうかを確認するために使用しているため、後でファイルを削除します

4

2 に答える 2

2

リンクの href 属性でバインディングを使用する場合、バインディングが評価されるように、 href ではなくng-hrefを使用する必要があります。例えば

<a ng-href="#/students/{{student.name}}">{{student.name}}</a>

それ以外の

<a href="#/students/{{student.name}}">{{student.name}}</a>

http://docs.angularjs.org/api/ng.directive:ngHrefの angular ドキュメントを参照してください。

于 2013-10-08T18:09:35.297 に答える