I currently have a project using AngularJS 1.
I am facing an issue with rendering HTML files using ngRoute. The problem lies in the app.js file where the app.config() method is not executing properly, causing the content inside ng-view to not display. Strangely, no errors are being thrown either.
Could someone offer assistance with this?
index.html
<head>
<title>Apollo</title>
<meta charset="utf-8" />
<!-- Other meta tags and stylesheet links omitted for brevity -->
<script src="public/lib/angular.min.js"></script>
<script src="public/lib/angular-route.js"></script>
<script src="app.js"></script>
<script src="src/controllers/HtmlController.js"></script>
</head>
<body ng-app="fiveer" class="m-page--fluid m--skin- m-content--skin-light2 m-header--fixed m-header--fixed-mobile m-aside-left--enabled m-aside-left--skin-dark m-aside-left--offcanvas m-footer--push m-aside--offcanvas-default">
<div class="m-grid m-grid--hor m-grid--root m-page">
<div class="m-grid__item m-grid__item--fluid m-wrapper">
<div class="m-content">
<div class="m-portlet m-portlet--space">
<div class="m-portlet__head">
<div class="m-portlet__head-caption">
<div class="m-portlet__head-title">
<div ng-view></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div ng-include="'footer.html'"></div>
</div>
<div id="m_scroll_top" class="m-scroll-top">
<i class="la la-arrow-up"></i>
</div>
<script src="assets/vendors/base/vendors.bundle.js" type="text/javascript"></script>
<script src="assets/demo/default/base/scripts.bundle.js" type="text/javascript"></script>
</body>
app.js
"use strict";
var app = angular.module("fiveer", ['ngRoute']);
app.config(function($routeProvider, $locationProvider) {
alert('Hello');
$routeProvider
.when('/', {
templateUrl: 'dashboard.html',
controller: 'HtmlController'
})
.when('/html1', {
templateUrl: 'src/views/html1.html',
controller: 'HtmlController'
})
.when('/html2', {
templateUrl: 'src/views/html2.html',
controller: 'HtmlController'
})
otherwise({redirectTo: '/'});
$locationProvider.hashPrefix('');
});
HtmlController.js
"use strict";
var app = angular.module("fiveer", []);
app.controller('HtmlController', ['$scope', function($scope) {
alert('Hello');
}]);
Project Structure