Spring Boot and angularJS - Routing is not working in my demo project

i am facing problem to implement the angular routing in one of my learning project, i am trying to create a very simple project for learning purpose and it seems i got stuck in the initial stage itself, please guide me what i am doing wrong here, below are the respective elements i have used in my project, index.html is the home page which works good , but somehow i am not able do achieve routing.

My goal : i want to create single page application , so i want view1, view2 should end up on index.html only and for that purpose i have used <div data-ng-view=""></div> in index.html.

note: i have not shared the spring elements (classes , maven pom , etc..) as i feel spring boot is working perfectly i am doing something wrong in the angularJS side.

any help will be greatly appreciable :)

app.js

appDemo.controller("view1controller",function($scope){ });

appDemo.controller("view2controller",function($scope){ });

appDemo.config(['$routeProvider',function($routeProvider) {$routeProvider.
                    when('/demo/view1', {templateUrl: 'view1.html',controller: 'view1controller'}).
                    when('/demo/view2', {templateUrl: 'view2.html',controller: 'view2controller'}).
                    otherwise({redirectTo: '/demo/view1'});
}]);

index.html

    <!DOCTYPE html>
    <html data-ng-app="demoApp">
    <head>
    <meta charset="ISO-8859-1">
    <title>demo</title>
    <script src="https://code.angularjs.org/1.2.20/angular.min.js"></script>
    <script src="https://code.angularjs.org/1.2.20/angular-resource.min.js"></script>
    <script src="https://code.angularjs.org/1.2.20/angular-route.min.js"></script>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

    </head>
    <body>

<div class="form-group">
<div data-ng-controller="view1controller"><a href="/demo/view1">get view1</a></div>
<div data-ng-controller="view1controller" ><a href="/demo/view2">get view2</a></div>
<div data-ng-view=""></div>
</div>


</body>
</html>

HomeController.java

@Controller
public class HomeController {

        private static final Logger logger = LoggerFactory.getLogger(HomeController.class);    

        @RequestMapping(value = "/", method = RequestMethod.GET)
        public String greeting(Map<String, Object> model) {

            return "index";
        }
    }

view1.html

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<h1>VIEW1</h1>
</body>
</html>

view2.html

<!DOCTYPE html>
    <html>
    <head>
    <meta charset="ISO-8859-1">
    <title>Insert title here</title>
    </head>
    <body>
    <h1>VIEW1</h1>
    </body>
    </html>

I am not sure if this is responsive. But this is easy to try. I am experimenting with angular and spring-boot as well. What I did was use web-jars version of angular. If you are using Spring-Boot is is hard to debug. Spring-Jars seems to be the route people are taking if you are using maven and client side scripting. Also, when I added the spring my script tags in my index I needed to load angular-min.js, angular-resource.min.js, and angular-load.min.js before I was able to get spring-boot to work. Once all three modules were loaded then angular seemed to work like a champ in spring-boot.