AngularJSを含むjQuery.load HTML

AngularJSコードを含むHTMLファイルを読み込めません！AngularJSを含むjQuery.load HTML

ここにある私のスニペット：

page1.html

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"></meta> 
    <meta name="viewport" content="width=device-width, initial-scale=1"></meta> 
    <script src="jquery-2.2.4.min.js"></script> 
</head> 
<body>   
    <div id="content"> 
    </div> 
    <script> 
     $(document).ready(function() { 
      $('#content').load('page2.html#body'); 
     });   
    </script> 
</body> 
</html>

page2.html

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"></meta> 
    <meta name="viewport" content="width=device-width, initial-scale=1"></meta> 
    <script src="angular.min.js"></script> 
</head> 
<body> 
    <div ng-app="myApp" ng-controller="customersCtrl">   
     {{ value }} 
    </div> 

    <script> 
    //<![CDATA[ 
     var app = angular.module('myApp', []); 
     app.controller('customersCtrl', function($scope) { 
      $scope.value = "hello world!"; 
     });  
    //]]> 
    </script> 

</body> 
</html>

PAGE2だけではうまく動作します！しかし、私はページ1の内側にそれをロードしようとすると、私は次のようなエラーメッセージが出ます：

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.4.8/ $injector/modulerr?p0=myApp&p1=Error%3A%2… at HTMLDocument.eval (eval at globalEval (jquery-2.2.4.min.js:2), :294:192) at i (jquery-2.2.4.min.js:2)

出典

2017-04-27 Jean Lopes

を角度は（正確にはをit needs jQLite）動作するようにjQueryを必要とします。 angular.min.jsの前に、page2.htmlにもインポートする必要があります。

<head> 
    <meta charset="utf-8"></meta> 
    <meta name="viewport" content="width=device-width, initial-scale=1"></meta> 
    <script src="jquery-2.2.4.min.js"></script> 
    <script src="angular.min.js"></script> 
</head>

出典

2017-04-27 12:22:58 Mistalis

jqueryを追加した後、正常に機能しました。しかし、私は混乱しています。ページ2だけをロードすると、明示的にjquery.jsをインポートせずに動作します。ちょっと興味があるんだけど –

AngularJSを含むjQuery.load HTML

答えて

関連する問題