Search code examples
javascriptangularjsngrouteroute-provider

TemplateUrl in ngRoute inaccessible

I'm trying to use ngRoute on AngularJS, so I create a index.php file with a ng-view div inside, this file is connected to my app.js file who contains my routeProvider.
But when I try to give the templateUrl for an URL... I don't understand who it's works.

My tree structure is like this:

nameApp/
├── dist/
│   ├─ html/
│   │   ├── index.php
│   │   └── connexion.php  
│   ├── js/
│   │    ├── app.js
│   └────└── connexion.php

My index.php:

<body ng-app="app">

   <div ng-view></div>

    <script src="https://code.jquery.com/jquery-2.2.4.js"   integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI="   crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
    <script src="https://code.angularjs.org/1.5.5/angular-route.js"></script>
    <script src="/js/app.js"></script>
</body>

My app.js:

var myApp = angular.module('app', ['ngCookies','ngRoute']);

myApp.config(function($routeProvider) {
    $routeProvider
        .when('/login', {$templateUrl: 'connexion.php'})
        .when('/test', {$templateUrl: 'test.php'})
        .otherwise({redirectTo: '/login1'});

        console.log("index.js");
});

So, I would like, when I'm going on the URL xxx/html/#/login to display my connexion.php but I have nothing, white page...

Anybody can help my please ? Thanks :)

Solution

  • try remove the $ $templateUrl:

    var myApp = angular.module('app', ['ngCookies','ngRoute']);

myApp.config(function($routeProvider) {
    $routeProvider
        .when('/login', {templateUrl: 'connexion.php'})
        .when('/test', {templateUrl: 'test.php'})
        //I'm guessing 'login1'was meant to be be 'login''
        .otherwise({redirectTo: '/login'});

        console.log("index.js");
});