Just modifying your code more simpler and easy, by just adding the ng-show attribute in all partial views just below the body tag(open).
HTML Page 1 :
<body>
<div ng-show="loadingState">
<div class="loading" id="loader"></div>
</div>
HTML Page 2 :
<body>
<div ng-show="loadingState">
<div class="loading" id="loader"></div>
</div>
<style>
.loading {
position: fixed;
z-index: 9999;
margin: 0 auto;
top: 0;
left: 0;
bottom: 0;
right: 0;
width: 100%;
height: 100%;
background-position: center;
background-repeat: no-repeat;
background-color: #fff;
background-image: url(EBSAjsN/Styles/images/icons/loader.gif);
/*background-size: cover;*/
}
</style>
$scope.loadingState = true;
$timeout(function () {
$scope.loadingState = false;
}, 1000);