I'm currently working with ngRoute in AngularJS. I have created an index.php file with an embedded ng-view div connected to my app.js file, which in turn contains my routeProvider. However, I am facing issues when trying to specify the templateUrl for a URL.
Here is the structure of my project:
nameApp/
├── dist/
│ ├─ html/
│ │ ├── index.php
│ │ └── connexion.php
│ ├── js/
│ │ ├── app.js
│ └────└── connexion.php
Contents of my index.php file:
<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>
Contents of my app.js file:
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");
});
When I visit the URL xxx/html/#/login, I expect to see my connexion.php file, however I am greeted with a blank page. Any assistance would be greatly appreciated. Thank you :)