Bonjour,

Je suis en train d'apprendre la base d'angularjs. J'essaie d'implémenter un système de changement de page sans avoir à reloader la totalité de la page.
Jusqu'à présent je faisais ça avec jquery. J'ai suivi un tas de tuto mais je n'ai jamais réussi à faire fonctionner.

J'utilise donc nodejs, angularjs, express et pug (anciennement jade).

Voilà donc mon code ultra simple. J'ai 3 pages:

• / (index)
• /page1
• /page2

Ces 3 pages peuvent être adressées indépendamment sans problème au travers de nodejs. J'implémente donc la partie angular js.
Mais voilà, ça ne fonctionne pas. Quand j'apelle la page /, pas de souci, il y a bien 'test accueil' dans ng-view. Si je clique sur un des liens pour les pages,
L'url se transforme. '/#page1' est ajouté à la suite de l'url qui devient donc 'http://localhost:3000/#page1', mais la div ng-view ne se remplit pas.

J'ai beau chercher sur le net et essayer des bouts de code tout fait, j'en reviens toujours au même problème. Voilà mon code.

layout.pug

html(ng-app='myApp')
  head
    title= title
    base(href='/')
    link(rel='stylesheet', href='/stylesheets/style.css')
    script(src='/javascripts/angular.min.js')
    script(src='/javascripts/angular-route.min.js')
  body
    block content
    script(type='text/javascript').
      var app = angular.module("myApp", ["ngRoute"]);
      app.config(function($routeProvider, $locationProvider) {
        $routeProvider
          .when("/", {
            template : "<div>test accueil</div>"
          })
          .when("/page1", {
            templateUrl : "/page1"
          })
          .when("/page2", {
            templateUrl : "/page2"
          })
          .otherwise({
            template : "<div>error</div>"
          });
        $locationProvider.html5Mode(true);
      });

index.pug:

extends layout

block content
  h1= title
  p Welcome to #{title}

  p
    a(href='#/') Main
  p
    a(href='#page1') Page1
  p
    a(href='#page2') Page2
  p
    div(ng-view='')

page1.pug:

.page
  | page 1

page2.pug

.page
  | page 2

Avez-vous une idée svp ?

EDIT: angular v1.6.3 et nodejs v6.10.0

-
Edité par zerros 25 mars 2017 à 17:14:06