1

I am having some trouble trying to use ngRoute of angular.

I am super noob in angular and javascript, so it would be great if you could explain to me why this code isn't working.

Here is my index.html 

<html ng-app="angular101App">

    <body>
        <h1>Index</h1>
        <div ng-view></div>

        <!--Angular-->
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular-resource.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular-route.js"></script>
        <script type="text/javascript" src="js/app.js"></script>

    </body>

</html>

This is the app.js

'use strict';

var app = angular.module('angular101App', [
    'ngResource',
    'ngRoute'
    ]);

  app.config(function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/home.html'
      })
      .when('/register', {
        templateUrl: 'views/register.html'
    })
      .otherwise({
        redirectTo: '/'
      });
  });

home.html

<a href="/register">Registrer</a>

And register.html

<h1>Register page :)</h1>

So, the result I am having running index.html is the header and the link for the "register" page. When I click on it a "Cannot get /register" appears.

The files structure is:

  • js
    • app.js
  • views
    • home.html
    • register.html

index.html

Thanks :)

compuTE
  • 120
  • 1
  • 10

0 Answers0