簡體   English   中英

包含AngularJS的jQuery.load HTML

[英]jQuery.load HTML containing AngularJS

我在加載包含AngularJS代碼的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可以正常工作! 但是,當我嘗試將其加載到page1中時 ,出現以下錯誤消息:

未捕獲的錯誤:[$ injector:modulerr] http://errors.angularjs.org/1.4.8/ $ injector / modulerr?p0 = myApp&p1 = Error%3A%2…at HTMLDocument.eval(eval在globalEval(jquery-2.2 .4.min.js:2)、: 294:192)在我(jquery-2.2.4.min.js:2)

Angular需要jQuery才能工作( 確切地說, 它需要jQLite )。 您也應該在angular.min.js之前將其導入angular.min.js

<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>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM