1. ホーム
  2. angularjs

[解決済み] AngularJS: ng-includeでangularスクリプトをロードするには?

2023-05-18 11:22:14

質問

私はangularでウェブページを作成しています。問題は、すでにangularなしで構築されたものがあり、私はそれらも含めなければならないということです。

問題はこれです。

main.htmlにこのようなものがあります。

<ngInclude src="partial.html">
</ngInclude>

そして、私のpartial.htmlは次のようなものです。

<h2> heading 1 <h2>
<script type="text/javascript" src="static/js/partial.js">
</script>

そして、私のpartial.jsはangularjsとは関係ありません。ngincludeは動作し、htmlを見ることができますが、javascriptファイルがロードされているのが全く見えません。firebug/chrome-dev-tool を使う方法は知っていますが、ネットワークリクエストが行われていることさえわかりません。私は何を間違えているのでしょうか?

angularがscriptタグに特別な意味を持っていることは知っています。私はそれを上書きすることができますか?

どのように解決するのですか?

1.2.0-rc1+では、受け取った回答は機能しません ( Github 問題 ).

によって作成されたクイックフィックスを紹介します。 エンドラマ :

/*global angular */
(function (ng) {
  'use strict';

  var app = ng.module('ngLoadScript', []);

  app.directive('script', function() {
    return {
      restrict: 'E',
      scope: false,
      link: function(scope, elem, attr) {
        if (attr.type === 'text/javascript-lazy') {
          var code = elem.text();
          var f = new Function(code);
          f();
        }
      }
    };
  });

}(angular));

このファイルを追加するだけで、ロード ngLoadScript モジュールをアプリケーションの依存関係としてロードし type="text/javascript-lazy" を、パーシャルで遅延ロードさせたいスクリプトの型として使用します。

<script type="text/javascript-lazy">
  console.log("It works!");
</script>