Question

我试图在ajax页面中加载angularjs应用程序的一部分，我已经使它与控制器一起使用但是使用带模块的angularjs应用程序很难

页

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<script>
    $(document).ready(function() {
        $("#bt").click(function(){
            $.ajax({
                url: "http://localhost/ajax/ng.php?p=1",
                success: function( data ) {
                    $("#game").html(data);
                }
            });
        });
    });
</script>
</head>
<body>
<input type="button" id="bt" value="poker"></input>

<div id="game">

</div>

</body>

</html>

PHP

<?php
    if (isset($_GET["p"])){
        header('Access-Control-Allow-Origin: *');
        //echo "<script src=\"http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js\"></script><div ng-app=\"myApp\"><h1 ng-controller='MainCtrl'>{{text}}</h1></div>";
        echo "<div ng-app><h1 ng-controller='MainCtrl'>{{text}}</h1></div><script src=\"http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js\"></script><script src=\"http://localhost/ajax/app.js\">";
    }

?>

JS档案

var myApp = angular.module('myApp', []);
myApp.controller('MainCtrl', ['$scope', function ($scope) {
$scope.text = 'Hello, Angular fanatic.';
}]);

每当我尝试在我的div中声明模块名称时，它都不会加载角度并仅显示{{text}}

Answer 1

您没有引导动态添加的html代码。不要使用ng-app，请使用

angular.bootstrap(element,["module"]

将html添加到元素后，必须调用

angular.bootstrap。另外，为什么不在整个文档中声明ng-app并使用ng-include或ngRoute加载动态部分？

如何在ajax应用程序中加载Angularjs应用程序？

1 个答案: