title: How to call spring controller via Angularjs Controller
body: <p>Hi i am new to spring restful service using angular.js, i need to display data returning from spring controller via angular js. Here i hava attached the code</p>
  
  <p>Controller file:-</p>
  
  <pre><code>        @Controller
          public class Control {
          @RequestMapping(value="/getContent",method = RequestMethod.GET,produces =                  {"application/json"})
          public @ResponseBody String show(){
          String msg = "welcome to spring angular js";
          return msg;
  
          }}
  </code></pre>
  
  <p>servlet file:</p>
  
  <pre><code>          &lt;context:component-scan base-package="spring" /&gt;
  
              &lt;mvc:annotation-driven content-negotiation-manager="contentManager"/&gt;
            &lt;bean id="contentManager"
              class="org.springframework.web.accept.ContentNegotiationManagerFactoryBean"&gt;
              &lt;property name="favorPathExtension" value="true"/&gt;
              &lt;property name="ignoreAcceptHeader" value="true" /&gt;
              &lt;property name="defaultContentType" value="text/html" /&gt;
              &lt;property name="useJaf" value="false"/&gt;
              &lt;property name="mediaTypes"&gt;
                  &lt;map&gt;
                      &lt;entry key="html" value="text/html" /&gt;
                      &lt;entry key="json" value="application/json" /&gt;
                      &lt;entry key="xml" value="application/xml" /&gt;
                  &lt;/map&gt;
              &lt;/property&gt;
             &lt;/bean&gt;
          &lt;bean id="jspViewResolver"
            class="org.springframework.web.servlet.view.InternalResourceViewResolver"&gt;
          &lt;/bean&gt;
          &lt;/beans&gt;
  </code></pre>
  
  <p>index.jsp file:</p>
  
  <pre><code>         &lt;head&gt;
             &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.js"&gt;&lt;/script&gt;
             &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular-route.js"&gt;&lt;/script&gt;
             &lt;script type="text/javascript" src="script.js"&gt;&lt;/script&gt;
             &lt;script type="text/javascript" src="controller.js"&gt;&lt;/script&gt;
  
             &lt;/head&gt;
            &lt;body&gt;
            &lt;h1&gt;Index file&lt;/h1&gt;
  
             &lt;a href="#/nextfile"&gt;Click&lt;/a&gt;
  
             &lt;div ng-view&gt;&lt;/div&gt;
  
              &lt;/body&gt;
             &lt;/html&gt;
  </code></pre>
  
  <p>index1.jsp file:</p>
  
  <pre><code>            &lt;html&gt;
              &lt;head&gt;
               &lt;meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"&gt;
               &lt;title&gt;Insert title here&lt;/title&gt;
               &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.js"&gt;                      &lt;/script&gt;
               &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular-route.js"&gt;&lt;/script&gt;
               &lt;script type="text/javascript" src="script.js"&gt;&lt;/script&gt;
               &lt;script type="text/javascript" src="controller.js"&gt;&lt;/script&gt;
  
               &lt;/head&gt;
              &lt;body&gt;
              &lt;h1&gt;Index1 file&lt;/h1&gt;
  
                &lt;div ng-controller="routeController"&gt;
  
                &lt;p&gt;Message is:{{$scope.Data}} &lt;/p&gt;
                &lt;script type="text/javascript" src="script.js"&gt;&lt;/script&gt;
                &lt;script type="text/javascript" src="controller.js"&gt;&lt;/script&gt;
                &lt;/div&gt;
                &lt;/body&gt;
               &lt;/html&gt;
  </code></pre>
  
  <p>Script.js file:</p>
  
  <pre><code>             var app = angular.module("sample",['ngRoute']);
               app.config(['$routeProvider',function($routeProvider){
              $routeProvider.when("/nextfile",{
              templateUrl: 'index1.jsp',
             controller: 'routeController'
             });
              }]);
  </code></pre>
  
  <p>Controller.js file:</p>
  
  <pre><code>            app.controller('routeController',function ($scope,$http){
               $http.get('http://domainname:8080/sample/getContent.json').success(function(data) {alert("success");$scope.Data =data;}).error(function(data){alert("failure");});
  </code></pre>
  
  <p>});</p>
  
  <p>Please specify a suggestion, Thanks in advance.</p>