GreatHawkeye GreatHawkeye - 3 months ago 22
AngularJS Question

AngularJS - Linking script into body tag

Here is my current Body tag:

<body ng-app="Mood">

<div id="moodApp" ng-view></div>

<script src="js/angular.js"></script>
<script src="js/angular-route-min.js"></script>
<script src="js/angular-animate.min.js"></script>
<script src="js/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.2.1/Chart.min.js"></script>
<script src="js/main.js"></script>




And here is the files tree :

enter image description here

Even though I would assume that it would work, i've got 404 errors :

enter image description here

In order to make it work, I have to add the folder name prefix like so :

<script src="mood/js/angular.js"></script>


Which is not what I want because when I'll push my work into the Git repo, other users wont have the "mood" folder.

How should I proceed to make it work without folder name prefix?

Thanks guys.

Answer

Use HTML base tag :

<head>
<base href="http://localhost/mood/"> or <base href="/">
</head>

<body ng-app="Mood">

<div id="moodApp" ng-view></div>

<script src="js/angular.js"></script>
<script src="js/angular-route-min.js"></script>
<script src="js/angular-animate.min.js"></script>
<script src="js/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.2.1/Chart.min.js"></script>
<script src="js/main.js"></script>

The <base> tag specifies the base URL/target for all relative URLs in a document.

Note : If the tag is present, it must have either an href attribute or a target attribute, or both.