2016-03-29 6 views
0

AJAXで動的HTMLコンテンツをロードしようとしていますが、angularJS classを使用して角度指示が含まれているため、コンパイルしています。

// Class 
var AngularHelper = (function() { 
    var AngularHelper = function() { }; 
    var defaultApplicationName = "MyApp"; 
    /** 
    * Compile : Compile html with the rootScope of an application 
    * and replace the content of a target element with the compiled html 
    * @$targetDom : The dom in which the compiled html should be placed 
    * @htmlToCompile : The html to compile using angular 
    * @applicationName : (Optionnal) The name of the application (use the default one if empty) 
    */ 
    AngularHelper.Compile = function ($targetDom, htmlToCompile, applicationName) { 
     var $injector = angular.injector(["ng", applicationName || defaultApplicationName]); 
     $injector.invoke(["$compile", "$rootScope", function ($compile, $rootScope) { 
      //Get the scope of the target, use the rootScope if it does not exists 
      var $scope = $targetDom.html(htmlToCompile).scope(); 
      $compile($targetDom)($scope || $rootScope); 
      $rootScope.$digest(); 
     }]); 
    } 

    return AngularHelper; 
})(); 

// jQuery 
$(document).ready(function(){ 
    $.get("http://fuiba.com/test/index.html", function(data) { 
    $("#result").html(data); 
    AngularHelper.Compile($("#result"), data); 
    }); 
}); 

// Angular 
angular.module('MyApp',[]).controller('AppCtrl', function ($scope) { 
    /**/ 
}); 

しかし、私はこのエラー(see this codepen)を取得:

$targetDom.html(...).scope is not a function 
+1

なぜ要素の上に指定されたHTMLをロードするために、 'NG-include'ディレクティブを使用していませんか? –

答えて

1

利用angular.element($targetDom).scope();代わりの$targetDom.html(htmlToCompile).scope();

関連する問題