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

这将显示JSON响应中的page.pageDataMap.mailId属性。

<强> 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>

将AngularJS集成到Spring应用程序中

1 个答案: