My current project structure is set up like this:
The application I am working on is hosted in a subdirectory called /my-scripts/vk.plants. This means that when I request this URL, it loads layout.html and returns it to the user.
layout.html contains the following code:
<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
<script src="/my-scripts/vk.plants/public/static/scripts/angular.js"></script>
<script src="/my-scripts/vk.plants/public/static/scripts/angular-route.js"></script>
<script src="/my-scripts/vk.plants/public/static/scripts/angular/app/app.js"></script>
<!-- include controllers and services -->
</head>
<body>
<h1>Angular Layout!!</h1>
<div ng-view></div>
</body>
</html>
And app.js looks like this:
(function(angular) {
'use strict';
var app = angular.module('app', ['ngRoute']);
app.config(function($routeProvider) {
$routeProvider
.when('/my-scripts/vk.plants', {
controller: 'home.controller',
templateUrl: '/my-scripts/vk.plants/public/static/scripts/angular/app/templates/home.html'
});
});
})(angular);
When attempting to open
http://my-url/my-scripts/vk.plantslayout.html, but the requests for my templates/home.html are not being processed and nothing from this template is displayed:
I am facing confusion with Angular routing as there are no errors showing in the console. Can someone provide an explanation?
What I require: When opening
http://my-url/my-scripts/vk.plantshome.controller and home.html.