Bonjour,

Voila je rencontre un petit problème avec mon code, j'ai essayé d'utiliser ng-view mais elle ne fonctionne pas
voilà ma page principale : index.html

<!DOCTYPE html>
<html>
<head>
      <meta charset="utf-8">
      <title>test ng-view</title>
</head>
<body ng-app="myapp">
      <script src="angular/angular.min.js"></script>
      <script src="angular/angular-route.min.js"></script>
      <script src="js/app.js"></script>

      <a href="#/1"> titre 1</a>
      <a href="#/2"> titre 2</a>
      <a href="#/3"> titre 3</a>
      <hr/>
      ** c'est ng-view ** <br/>
      <ng-view></ng-view>
</body>
</html>

voilà mes pages à injecter :
page1.html

<div>
    <h1> <strong>page 1</strong></h1>
    <p align="center"> bonjour : titre 1</p>
</div>

page2.html

<div>
    <h1> <strong>page 2</strong></h1>
    <p align="center"> bonjour : titre 2</p>
</div>

page1.html

<div>
    <h1> <strong>page 3</strong></h1>
    <p align="center"> bonjour : titre 3</p>
</div>

voilà le code js : app.js

var app=angular.module("myapp",["ngRoute"]);
app.config(function($routeProvider){
    $routeProvider.when("/1",{templateUrl:"views/page1.html"})
        .when("/2",{templateUrl:"views/page2.html"})
        .when("/3",{templateUrl:"views/page3.html"})
});

quand je tape l'url suivant

http://localhost:8080/index.html

j'obtient ma page index.html, mais lorsque je clique sur le lien titre1 ou titre2 ou bien titre3, ne n'obtient rien et voilà url apparu sur le navigateur quand je clique sur l'un des liens
titre 1

http://localhost:8080/index.html#!#%2F1

titre 2

http://localhost:8080/index.html#!#%2F2

titre 3

http://localhost:8080/index.html#!#%2F3

je ne sais pas d'où le probleme, merci de votre aide

11 réponses


Fatima Dirham
Auteur
Réponse acceptée

Bonjour,
j'ai essayé de changer les fichiers angular par les liens et ça marche, Apparemment, le problème réside dans les fichiers angular que j'ai
je ne sais pas pourquoi
merci

voilà l'arborescence

+static
    +angular
        -angular-route.min.js
        -angular.min.js
    +js
        -app.js
    +views
        -page1.html
        -page2.html
        -page3.html
    -index.html

et rien ne s'affiche sur le console

tu as testé de rajouter ./ devant le chemin de tes views? on sais jamais

ça ne marche pas

Salut,

Essaye de charger tes scripts juste avant la fermeture de la balise <body>. Tu n'as aucune erreur dans ta console ?

betaWeb
j'ai essayé ce que vous avez demandé mais le probleme reste le meme et je n'ai aucune erreur dans la console

Bonjour,

d'après la doc, ils semblerait qu'il faille enlever les hash ici :

<a href="#/1"> titre 1</a>
<a href="#/2"> titre 2</a>
<a href="#/3"> titre 3</a>

devient donc

<a href="1"> titre 1</a>
<a href="2"> titre 2</a>
<a href="3"> titre 3</a>

prbaron
j'ai essayé mais j'ai obtenu un erreur qui s'affiche sur la page html

Whitelabel Error Page

This application has no explicit mapping for /error, so you are seeing this as a fallback.

Thu May 04 16:32:28 BST 2017
There was an unexpected error (type=Not Found, status=404).
No message available

jimibi
je n'ai pas bien compris, la compilation passe normallement sans erreur

Il semblerait qu'il manque une route pour /error. Qu'est ce qui provoque la redirection vers cette page ?

/error apparait lorsque j'enleve le " # " de liens