Q:

Angular loading images from a ng-view file

I have a single page app.(index.html). The relevant parts are given below.
<!DOCTYPE html>
<html>
<head>
<base href="/mi_ui/">
<link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css">
<script src="assets/js/angular.js"></script>
...
<body ng-app="sk" ng-controller="mainController as main">
<div ng-view></div>

The route file relevant parts:
.when('/home',{
        templateUrl: 'views/home.html',
        controller: 'homeController',
        controllerAs: 'home',
    })

My code is in a folder named as mi_ui. Only the base href path i set above works. All other values like (/) will not load the resources.
My Folder structure is:
mi_ui
--assets
----css
----js
----images
------loader.gif
--services
--controllers
--views
----home.html
app.js
index.html

The above application works flawlessly. Issue is, i want to load the loader.gif in home.html. I put the below code:
<img ng-src="assets/images/loader.gif" id="gif">

But this image is not loaded. From Chrome developer console i saw that sources tab only have files that are referenced in index.html!. So if i put the img line in index.html ,the file is loaded and is shown in Chrome sources tab. But not from home.html. Any idea how to fix this?
I am running the app in tomcat 7.

A:

replace ng-src with src
<img src="assets/images/loader.gif" id="gif">

