Интегрирование AngularJS в Спринг Применение

Question

я в настоящее время есть метод в мой контроллер, который делает это:

@RequestMapping(value="/angular", produces="application/json") 
public @ResponseBody Page handleAngularRequest(Model model, HttpServletRequest httpRequest){ 
    return pageObject; 
} 

Это возвращает все данные JSON на странице, как так:

{ 
"pageId": null, 
"organizationId": null, 
"pageModule": "browse", 
"pageTitle": null, 
"pkId": null, 
"templateId": null, 
"dataMap": null, 
"pageEventList": null, 
"pageElementList": null, 
"tableId": null, 
"elementId": null, 
"elementDictionaryList": null, 
"elementDictionaryEventList": null, 
"elementIds": null, 
"pageDataMap": { 
    "pageObjectId": "", 
    "module": "REQUISITION", 
    "mailId": "test@example.com", 
    "sessionId": "9d538ba3-2d41-4d5b-9f0d-4ac467f5e62e", 
    "requestId": "21061c6c-2868-46c7-bd31-bbebfb2eee4e", 
    "userId": "JHUBBARD0000000", 
    "pages": "", 
    "systemId": "9d538ba3-2d41-4d5b-9f0d-4ac467f5e62e", 
    "service": "", 
    "formatHeader": "Y", 
    "extrinsic": { 
     "pageObjectId": "", 
     "module": "REQUISITION", 
     "mailId": "test@example.com", 
     "sessionId": "9d538ba3-2d41-4d5b-9f0d-4ac467f5e62e", 
     "requestId": "21061c6c-2868-46c7-bd31-bbebfb2eee4e", 
     "userId": "test", 
     "pages": "", 
     "systemId": "9d538ba3-2d41-4d5b-9f0d-4ac467f5e62e", 
     "service": "", 
     "formatHeader": "Y" 
    }, 
    "header": { 
     "RequisitionHeader_icReqHeader": "" 
    } 
} 
} 

Мой вопрос: Как я получаю эти данные в контроллер/рабочий процесс AngularJS, поэтому я могу начать привязывать его и помещать на страницу?

Answer 1

Быстрый запуск будет выглядеть так: http://plnkr.co/edit/uUj4MV3RvZB2P4uJt35H?p=preview

Это покажет page.pageDataMap.mailId свойство из ответа JSON.

app.js

angular.module('app', []) 
    .service('ApiService', ['$http', '$q', function($http, $q) { 
    return { 
     query: function() { 
     var deferred = $q.defer(); 

     $http.get('/angular') 
      .success(function(data) { 
      deferred.resolve(data); 
      }); 

     return deferred.promise; 
     } 
    }; 
    }]) 
    .controller('Controller', ['ApiService', '$scope', function(ApiService, $scope) { 

    $scope.page = {}; 

    $scope.refresh = function() { 
     ApiService.query() 
     .then(function(data) { 
      $scope.page = data; 
     }); 
    }; 

    $scope.refresh(); 
    }]) 

index.html

<div ng-app="app" ng-controller="Controller"> 
    <div ng-bind="page.pageDataMap.mailId"></div> 
</div>