Sanjay Yadav Sanjay Yadav - 1 year ago 162
AngularJS Question

Angular Uncaught Error: [$injector:modulerr]

I am troubling with angular js error
angular.js:36 Uncaught Error: [$injector:modulerr]$injector/modulerr?p0=app&p1=Error%3A%20…

index.php code is

<!DOCTYPE html>
<html ng-app="app">

<script src=""></script>
<script src=""></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>

<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
<!--sliding panel directive-->
<alerts-center ng-if="parentslide"></alerts-center>



js code is

.controller("Ctrll",function($scope, $timeout){
$scope.parentslide =false;
$scope.showAlerts = function($event) {
$scope.parentslide =true;
.controller('alertsCtrl', function ($scope) {
$scope.$on('openAlerts', function(event, args) {
$scope.slide = !$scope.slide;
.directive('alertsCenter', function () {
return {
templateUrl: 'alerts.php',
restrict: 'E',

Answer Source

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=""></script>
<script data-require="angular-animate@1.2.17" data-semver="1.2.17" src=""></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']);
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download