AngularJs has widely used technology nowadays which is introduced by GOOGLE and it is mainly used for single page application. To integrate AngularJs with SpringBoot is very simple we can integrate AngularJs with CDN also but in this, I will show you how to integrate AngularJS using
Steps to follow:
- Add AngularJs webJar in your pom.xml file
- create a javascript file inside your static folder
- link
webjar and javascript file in your JSP page - Create a Controller class for display your JSP page
Project Directory Structure:
1- Angular WebJar :
<dependency>
<groupId>org.webjars</groupId>
<artifactId>angularjs</artifactId>
<version>1.7.0</version>
</dependency>
2- main.js
var app=angular.module('myapp',[]);
app.controller('myctrl',function($scope){
$scope.firstname="vasu Rajput";
});3- index.jsp
<html ng-app="myapp">
<body ng-controller="myctrl">
<h1>Hi You are a Nice Guy {{firstname}}</h1>
<p>Angular Example 2 way Binding</p>
<input type="text" ng-model="tyeMe"><br>
<h4>{{tyeMe}}</h4>
<script src="webjars/angularjs/1.7.0/angular.js"></script>
<script src="JS/main.js"></script>
</body>
</html>4- MyController.java
@Controller
public class MyController {
@GetMapping("/")public String index() {return "index";}
}
Now run your programe you will see output like:
