Old AngularJS Demo Not Working

Question

I am a beginner to java ee and angular JS, I found a code from a website (http://www.simplecodestuffs.com/angularjs-interacting-with-java-servlet-using-json/) I am trying to implement it in eclipse. but when i click the button "fetch data from server" the output doesnot appear as expected

Output:

First Name: {{person.firstName}}

Last Name: {{person.lastName}}

here is my JSP :

<!DOCTYPE html>

    <html>
    <head>
    <meta charset="ISO-8859-1">
    <title>AJAX with Servlets using AngularJS</title>

    <script type="text/javascript" src="jas/angular.min.js"> </script>
    <script>
    var app = angular.module('myApp', []);
    function MyController($scope, $http) {

        $scope.getDataFromServer = function() {
                $http({
                        method:'GET',
                        url:'http://localhost:8080/Angular/AngularJsServlet'
                }).success(function(data, status, headers, config) {
                        $scope.person = data;
                }).error(function(data, status, headers, config) {
                        // called asynchronously if an error occurs
                        // or server returns response with an error status.
                });

        };
    };

    </script>
    </head>
    <body>
    <div ng-app="myApp">
            <div ng-controller="MyController">
               <button ng-click="getDataFromServer()"> Fetch data from server </button>
               <p>First Name: {{person.firstName}}</p>
               <p>Last Name: {{person.lastName}}</p>
            </div>
    </div>
    </body>

</html>

here is my servlet:

@WebServlet("/AngularJsServlet")
public class AngularJsServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;

    /**
     * @see HttpServlet#HttpServlet()
     */
    public AngularJsServlet() {
        super();
        // TODO Auto-generated constructor stub
    }

    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            PersonData personData = new PersonData();
            personData.setFirstName("Mohaideen");
            personData.setLastName("Jamil");

            String json = new Gson().toJson(personData);
            response.setContentType("application/json");
            response.getWriter().write(json);
    }



    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        //doGet(request, response);
    }

}

score 1 · Accepted Answer · answered Aug 13 '17 at 19:36

Due to 3f2232b5, $controller will no longer look for controllers on window. The old behavior of looking on window for controllers was originally intended for use in examples, demos, and toy apps. We found that allowing global controller functions encouraged poor practices, so we resolved to disable this behavior by default.

To migrate, register your controllers with modules rather than exposing them as globals

— AngularJS Developer Guide - Migrating to V1.3.

Due to b54a39, $http's deprecated custom callback methods - .success() and .error() - have been removed. You can use the standard .then()/.catch() promise methods instead, but note that the method signatures and return values are different.
$http(...)
  .then(function onSuccess(response) {
    // Handle success
    var data = response.data;
    var status = response.status;
    var statusText = response.statusText;
    var headers = response.headers;
    var config = response.config;
    ...
  }).catch(function onError(response) {
    // Handle error
    var data = response.data;
    var status = response.status;
    var statusText = response.statusText;
    var headers = response.headers;
    var config = response.config;
    ...
  });
— AngularJS Developer Guide - Migrating to v1.6 - http

Old AngularJS Demo Not Working

1 Answers1