Angular Uncaught Error: [$injector:modulerr]
Question
I am troubling with angular js error angular.js:36 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.19/ $injector/modulerr?p0=app&p1=Error%3A%20…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.19%2Fangular.min.js%3A18%3A139)
index.php code is
<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
<script src="http://code.angularjs.org/1.2.17/angular-animate.js"></script>
<link rel="stylesheet" href="<?php bloginfo('template_url')?>/style.css" />
<script src="<?php bloginfo('template_url')?>/angular-animate.js"></script >
<script src="<?php bloginfo('template_url')?>/script.js"></script>
</head>
<body ng-controller="Ctrll">
<p style="color:#000;margin:0"><span>slide:</span>{{slide}} </p>
<button ng-click="showAlerts()" style="float:left">
click to toggle panel
</button>
<!--sliding panel directive-->
<alerts-center ng-if="parentslide"></alerts-center>
</body>
</html>
js code is
angular.module("app",["ngAnimate"])
.controller("Ctrll",function($scope, $timeout){
$scope.parentslide =false;
$scope.showAlerts = function($event) {
$scope.parentslide =true;
$timeout(function(){
$scope.$broadcast('openAlerts');
},1)
}
})
.controller('alertsCtrl', function ($scope) {
$scope.$on('openAlerts', function(event, args) {
$scope.slide = !$scope.slide;
});
})
.directive('alertsCenter', function () {
return {
templateUrl: 'alerts.php',
replace:true,
restrict: 'E',
controller:'alertsCtrl'
};
});
1 answers
solution1
1 ACCPTED 2016-06-06 14:49:04
If you working in plunker its fine. If not then the error may be due to
<script data-require="angular.js@1.2.20" data-semver="1.2.19" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
<script data-require="angular-animate@1.2.17" data-semver="1.2.17" src="http://code.angularjs.org/1.2.17/angular-animate.js"></script>
data-require and data-semver are actually specific implementations by Plunker.
Better to use: bower install angular-animate and add the script tag
< script src="/bower_components/angular-animate/angular-animate.js"></script >
finally Dependency injection
angular.module('myApp', ['ngAnimate']);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.