Question

您好我试图以角度方式实现弹出，但在这样做时我收到错误Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.4.9/$injector/modulerr?p0=PopupDemo&p1=Error%…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.4.9%2Fangular.min.js%3A19%3A463)

以下是我编写的代码。

     <head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
    <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>

<body ng-app="PopupDemo">
<div ng-controller="PopupDemoController">
<a ng-click="open()">Open Popup</a>
</div>

    <script>
        angular.module('PopupDemo', ['ui.bootstrap']);
        angular.module('PopupDemo')
                .controller('PopupDemoController',['$scope','$modal',function ($scope, $modal) {

        $scope.open = function () {
        var modalInstance = $modal.open({
            templateUrl: 'first.html',
        });
}
}]);
    </script>
</body>

我不知道为什么我会收到错误以及出路是什么。没有从在线资源和角网站获得任何帮助..

我知道文件中缺少一些模块，但不知道如何检查它。

有人可以帮助我......我会陷入困境。

非常感谢你们

Answer 1

更新

您缺少ui.bootstrap.js文件。请包括那个。包含bootstrap.js是不够的。

另外，请使用$ uibModal而不是$ modal

{{1}}

JQuery js应该在bootstrap js之前出现。你可以试试吗

Answer 2

尝试替换此代码

<script>
    var app = angular.module('PopupDemo', ['ui.bootstrap']);
    app.controller('PopupDemoController', ['$scope', '$modal',    function($scope, $modal) {
            $scope.open = function() {
                var modalInstance = $modal.open({
                    templateUrl: 'first.html',
                });
            }
        }]);
</script>

Answer 3

你没有加载ui.bootstrap模块你可以使用this cdn

Answer 4

看来你还需要添加角度bootsrap-ui参考：例如：

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.1/ui-bootstrap.js"></script>

Answer 5

以下代码应该可行。

已添加bootstrap.ui js
相应更改了模块名称

代码：

<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>   
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.1/ui-bootstrap.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
</head>
<body ng-app="PopupDemo">
<div ng-controller="PopupDemoController">
    <a ng-click="open()">Open Popup</a>
</div>

<script>
    var myMod = angular.module('PopupDemo', ['ui.bootstrap']);
    myMod.controller('PopupDemoController', ['$scope', '$uibModal', function($scope, $modal) {

        $scope.open = function() {
            var modalInstance = $modal.open({
                templateUrl: 'first.html',
            });
        }
    }]);
</script>
</body>

angularjs：-Uncaught错误：运行代码时出现[$ injector：modulerr]问题

5 个答案: