3

によってロードされた他のモジュールのディレクティブを使用しようとしていますangular.injectorが、angular は にあるディレクティブを理解できませんother_module
メイン ファイルで、モジュールを宣言します。

  angular.module('blockApp', []).directive('', []);      

2 番目のファイルでは、angularCharts を依存関係として追加しようとしています。

  var otherBlock = angular.module('blockApp');
  otherBlock.run(function() {
      angular.injector(['ng', 'angularCharts']);
  });

次にangularCharts、のディレクティブを使用しますが、angularjs はそれらを識別できません。モジュールを宣言するときに依存モジュールを追加する必要があることはわかっていますが、それは特殊なケースです。

4

1 に答える 1

1

ここにplnkrがありますhttp://plnkr.co/edit/Q5oD65wSvBAemf5BCDL7?p=preview

この場合、$compile を使用できます (例の $scope はまだ必要ですが、$compile は私が推測する質問にほとんど答えます)。

    var $compile = chartsInjector.get("$compile");
    console.log("$compile=",$compile);

    var chartsDirective = $compile("<div charts></div>");
    console.log(chartsDirective);

...

  var blockapp = angular.module('blockApp', []); 
  blockapp.run(function(){
    // create a new injector
    var chartsInjector = angular.injector(['ng', 'angularCharts']);
    console.log("chartsInjector=",chartsInjector);

    var $compile = chartsInjector.get("$compile");
    console.log("$compile=",$compile);

    var chartsDirective = $compile("<div charts></div>");
    console.log(chartsDirective);
  })

ここで複数のインジェクターを作成することに注意してください。

インジェクター 1) ng-app で作成

<body ng-app="blockApp">

インジェクター 2) angular.injector() によって作成

var chartsInjector = angular.injector(['ng', 'angularCharts']);

コード全体

<!DOCTYPE html>
<html>

  <head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
    <script type="text/javascript">
      // creating the angularcharts
      angular.module('angularCharts', []).directive('charts', function(){
        return function(){}
      }); 

      // creating blockapp
      angular.module('blockApp', []).directive('', []); 

      // retrieving the created blockapp
      // NOTE! ng-app will create a new injector for blockapp 
      var blockapp = angular.module('blockApp', []); 
      blockapp.run(function(){
        // create a new injector
        var chartsInjector = angular.injector(['ng', 'angularCharts']);
        console.log("chartsInjector=",chartsInjector);

        var $compile = chartsInjector.get("$compile");
        console.log("$compile=",$compile);

        var chartsDirective = $compile("<div charts></div>");
        console.log(chartsDirective);
      })

    </script>
  </head>

  <body ng-app="blockApp">

  </body>

</html>

plnkr http://plnkr.co/edit/Q5oD65wSvBAemf5BCDL7?p=preview

于 2014-10-08T07:42:12.340 に答える