Error: [$injector:modulerr] using routes

710 views Asked by At

I know there are multiple threads about this topic, but even with the answers on those threads my test won't work.

I have tried to add the Angular Route JS file And put it in the HTML after my Angular file. Still I get the same error.

error: Error: [$injector:modulerr] http://errors.angularjs.org/1.3.16/$injector/modulerr?p0=App&p1=%5B%24injector%3Aunpr%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.3.16%2F%24injector%2Funpr%3Fp0%3D%2524routProvider%0AF%2F%3C%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A6%3A417%0Abb%2Fr.%24injector%3C%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A38%3A7%0Ad%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A36%3A13%0Ae%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A36%3A283%0Ad%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A34%3A490%0Ag%2F%3C%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A35%3A117%0Aq%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A7%3A320%0Ag%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A34%3A399%0Abb%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A38%3A135%0Axc%2Fd%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A17%3A381%0Axc%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A18%3A179%0AOd%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A17%3A1%0A%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A251%3A429%0Aa%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A165%3A93%0Aqf%2Fc%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.16%2Fangular.min.js%3A32%3A384%0A

var App = angular.module('App', ['ngRoute']);

App.config(function ($routProvider) {
 $routeProvider.
  when('/', 
   {
    templateUrl: 'partials/list.html'
   })
});

App.controller('ProjectListCtrl', function ($scope) {
 $scope.projects = [
  {
   'title': 'Loook',
   'category': 'Kleding app, Logo'
  }
 ];
});
<html>
<head>
 <meta charset="UTF-8">
 <link rel="stylesheet" type="text/css" href="fonts/fonts.css">
 <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>

 <section ng-app="App" ng-controller="AppCtrl">

  <a href="/">Overzicht</a>

  <ng-view></ng-view>

 </section>

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.min.js"></script>
 <script src="https://raw.githubusercontent.com/angular/bower-angular-route/master/angular-route.js"></script>
</body>
</html>

1

There are 1 answers

4
Mathew Berg On BEST ANSWER

The file you linked: https://raw.githubusercontent.com/angular/bower-angular-route/master/angular-route.js. Is for angularjs 1.3.17 (you can see it in the top of the comments). The angular you're using is 1.3.16, there's a conflict there. Beyond that can you paste the actual error you are getting?

As a side note, you can just use this: https://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular-route.min.js