CODEWITHSUNDEEP
javascriptangularjsangular-material
Yulian Kukh
Yulian Kukh

Reputation: 1

Angularjs Material $injector error

Idk what is going on but I can't find any reasons why I get this $injector error while trying to use AngularJs material. I really don't know where to ask. I tried every possible way I could have thought of to resolve this but I couldn't. The thing is that before it worked fine till I got an idea to add some awesome styles from angular material. Help... Basically below is shortened example of the project. 

Unknown provider: $$HashMapProvider <- $$HashMap <- $$animateQueue <- $animate 
    <- $compile <- $mdUtil <- $mdTheming <- $$animateQueue

jquery-3.2.1.min.js:2 Uncaught Error: [$injector:unpr] http://errors.angularjs.org/1.6.6/$injector/unpr?p0=%24%24HashMapProvider%20%3C-%20%24%24HashMap%20%3C-%20%24%24animateQueue%20%3C-%20%24animate%20%3C-%20%24compile%20%3C-%20%24mdUtil%20%3C-%20%24mdTheming%20%3C-%20%24%24animateQueue
    at angular.min.js:7
    at angular.min.js:46
    at Object.d [as get] (angular.min.js:43)
    at angular.min.js:46
    at d (angular.min.js:43)
    at e (angular.min.js:44)
    at Object.invoke (angular.min.js:44)
    at angular.min.js:46
    at d (angular.min.js:43)
    at e (angular.min.js:44)

html

<html lang="en" ng-app="app" ng-cloak>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>qwe</title>

    <!-- <link rel="stylesheet" type="text/css" href="src/css/bundle.css"> -->
    <link rel="stylesheet" type="text/css" href="src/css/app.css">
    <link rel="stylesheet" type="text/css" href="src/lib/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="src/lib/font-awesome.min.css">
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.css">

</head>
<body>

<div ng-view></div>

<script src="src/lib/angular.min.js"></script>
<script src="src/lib/angular-route.min.js"></script>

<!-- AngularJS Material Dependencies -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-aria.min.js"></script>


<!-- AngularJS Material Javascript now available via Google CDN; version 1.1.4 used here -->
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.4/angular-material.min.js"></script>

<script src="src/js/registration.js"></script>
</html>

js

var app = angular.module('app', ['ngRoute', 'ngMaterial']);
app.config(function($routeProvider, $locationProvider) {
  $routeProvider
    .when('/', {templateUrl: 'view/reg/reg.html',controller: 'registration'})
    .when('/view/login', {templateUrl: 'view/login/login.html', controller: 'login'})
});

Upvotes: 0

Views: 490

Answers (1)

que1326
que1326

Reputation: 2325

You are using angular js version 1.6.6, therefore you should use the same version for angular animate and aria. The animate module had some issues with the latest versions, if you don't manage to resolve this try using a lower version ( example: use angular 1.5.x & angular animate 1.5.x & angular aria 1.5x )

Upvotes: 2

Related Questions