Encountering an issue with AngularJS routes related to file paths. The folder structure is as follows:
js -> Angular ->
css -> Bootstrap ->
index.html
Routes work fine when hosted on a server like IIS. However, copying and pasting the directive or sharing it in another location causes "Files not found" errors when run from the file system.
This is how my index.html appears:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<base href="" />
<!--css-->
<link href="./css/Bootstrap/bootstrap.min.css" rel="stylesheet" />
</head>
<body ng-app="myApp">
<div class="container-fluid">
<!--content-->
<!--menu tabs-->
<div class="col-md-12" style="margin-top:10px;">
<a href="/car"> CAR</a> <br/>
<a href="/mobile">Mobile</a>
</div>
<!--angular template placeholder-->
<div ng-view> </div>
<!--footer-->
</div>
<!--js-->
<script src="./js/Angular/Lib/angular.js"></script>
<script src="./js/Angular/Lib/angular-route.js"></script>
<script src="./js/Angular/Config/ngRouteConfig.js"></script>
The 404 error occurs only when the base tag is included in the HTML. Removing it allows the page to render properly but disables angular routing.
A senior advised against specifying absolute paths, but I cannot find any instances of this in my index.html file.
How can I specify relative paths so that others with the same folder structure can run the demo app successfully?
Any help or suggestions would be greatly appreciated.