1

I am currently ramping up with angular, and trying to make dynamic routing work.

Note: I have looked at the question: How to defer routes definition in Angular.js?, and I believe I am doing everything it states, but I'm still getting the error "unknown provider: $routeProvider"

What am I doing wrong?

html:

<!doctype html>
<html ng-app="rProvider">
  <head>
      <link rel="stylesheet" href="css/style.css">
      <script src="lib/angular/angular.js"></script>
      <script src="js/routeProviderTest.js"> </script>
  </head>
  <body>
      <div ng-controller="rControl">
          <h2>Route Controller Test</h2>
          [<a href="r1">Route 1</a> | <a>Route 2</a>]
          <hr/>
          <span class="partial-info">
          Partial: {{routeValue}}
          </span>
          <div ng-view></div>
          <small>The Bottom</small>
      </div>
  </body>
</html>

js:

var myAppModule = angular.module('rProvider',[]);

myAppModule.config(function($routeProvider){
    $routeProvider.when("r1",{templateUrl:"/route1.html"});
});

myAppModule.controller('rControl', function($scope, $route){
    $scope.routeValue = 'nothing yet';
});

thanks in advance...

Community
  • 1
  • 1
Spaajanen
  • 383
  • 6
  • 15
  • Create a plunk or jsfiddle to show the problem – Ye Liu Jul 19 '13 at 14:40
  • @Sarah I agree with Ye Liu, I don't see anything obvious that you're doing wrong. The issue might have to do with the version of Angular you're using (I believe in the newest versions they have begun to break things down). The angular team has decided going forward to version 2 they will break up all the pieces of the Angular framework so developers can decide which pieces they want and leave the rest behind (lightening the load and allowing for more interoperability) – shaunhusain Jul 19 '13 at 17:25

2 Answers2

3

If you are using version 1.2.x, you need to download angular-route.js, include it via the <script> tag, and add it as a dependency module in JavaScript:

<!-- in HTML -->
<script src='angular-route.js'></script>

// in JavaScript
var myAppModule = angular.module('rProvider', ['ngRoute']);
shaolang
  • 995
  • 11
  • 25
1

Maybe this will help you:

http://www.egghead.io/video/gNtnxRzXj8s

This guy has some pretty good tutorials on AngularJS. Or some of the next videos about the routeProvider.

justGoscha
  • 24,085
  • 15
  • 50
  • 61
  • 1
    John Lindquist has really done a fantastic job on these videos (they were the first resource I used to get my feet wet and I still return often). I worked at the same company as him for a few years (Roundarch, he was a very good AS3 dev too from what I had seen), you should throw him a couple of bucks (buy him a beer, or his kid a bib) if he helped you out. – shaunhusain Jul 19 '13 at 17:21