Question

我有一个Spring MVC Controller返回一个带有属性的页面，如下所示

@RequestMapping(method = RequestMethod.GET, value = "/create")
public ModelAndView getAddAccountView() {
    ModelAndView model = new ModelAndView("protected/accounts/AccountAddView");
    List<Client> clients=clientService.findAll();
    model.addObject("listClients", clients);
    return model;
}

客户端是@Entity

在我的AccountAddView.jsp文件中，我正在尝试使用ng-init，如下所示：

<div class="row-fluid" ng-controller="accountsController as ctrl" ng-init="clients=${listClients}">

在我的app.js中，在我的控制器中，我尝试访问客户端列表，如下所示

var listOfClients=$scope.clients;

但我仍然收到以下错误

angular.min-1.5.3.js:116 Error: [$parse:lexerr] http://errors.angularjs.org/1.5.3/$parse/lexerr?p0=Unexpected%20nextharacter%20&p1=s%2033-33%20%5B%40%5D&p2=clients%3D%5Bsoftbank.ui.model.Client%4042%2C%softbank.ui.model.Client%4041%2C%softbank.ui.model.Client%4043%5D
at Error (native)
at http://localhost:8080/softbank/resources/js/angular.min-1.5.3.js:6:416
at gc.throwError (http://localhost:8080/softbank/resources/js/angular.min-1.5.3.js:212:149)
at gc.lex (http://localhost:8080/softbank/resources/js/angular.min-1.5.3.js:211:16)
at Object.ast (http://localhost:8080/softbank/resources/js/angular.min-1.5.3.js:216:103)
at Object.compile (http://localhost:8080/softbank/resources/js/angular.min-1.5.3.js:225:232)
at hc.parse (http://localhost:8080/softbank/resources/js/angular.min-1.5.3.js:252:380)
at e (http://localhost:8080/softbank/resources/js/angular.min-1.5.3.js:123:317)
at m.$eval (http://localhost:8080/softbank/resources/js/angular.min-1.5.3.js:142:463)
at pre (http://localhost:8080/softbank/resources/js/angular.min-1.5.3.js:271:500)

请问这里有什么问题。为什么ng-init会产生这个错误？提前感谢您的回答。

Answer 1

我刚开始使用Angular和Spring，所以我要做的就是解释我是如何做到的，你可以看看它是否适合你。

首先，我没有尝试通过ModelAndView获取我的数据。我让我的“常规”控制器返回视图但通过角度控制器和服务获得我的数据以及Spring侧的@RestController（那时是两个独立的Spring控制器）。

要仅返回视图，您至少有两个我知道的选项。一，你可以在没有这样的模型的情况下返回ModelAndView：

public ModelAndView yourView() {
    return new ModelAndView("yourView");
}

或者两个，将视图的名称返回为字符串，如下所示：

public String yourView() {
    return "yourView";
}

在这两种情况下，您显然需要正确的@RequestMapping。

在我看来，我有一个角度控制器功能，它调用我的相关角度服务，然后调用我的@RestController等等。我发起了这样的数据：

ng-controller="MyController as ctrl" ng-init="ctrl.allThings()"

代码示例：

角度控制器：

self.allThings = function () {
        ThingService.things()
            .then(
                function (data) {
                    self.things = data;
                },
                function (errResponse) {
                    console.error("Error retrieving thing list");
                }
            );
    };

角度服务：

    things: function() {
        return $http.get('/things')
            .then(
                function(response) {
                    return response.data;
                },
                function (errResponse) {
                    return $q.reject(errResponse);
                }
            );
    },

Spring REST控制器：

@RequestMapping(value = "/things", method = RequestMethod.GET)
public List<Thing> things() {
    return thingService.findAll();
}

我想你知道Spring方面剩下的代码。杰克逊将为您处理所有对象转换。

Answer 2

Old Post但我仍然想回答，任何使用Angular和Spring MVC的人都会得到一些帮助使用模型属性是Angular面临的挑战。之前我在模型属性中设置员工数据，如mav.addObject("employee",employee)，但当我尝试在jsp中使用${employee}时，Angular无法使用ng-init指令设置java对象，因为它期待一个java脚本对象。所以我在模型Attribute mav.addObject("employeeJson", empJson)中设置json并使用json.Parse()解析它以将其转换为Java Script Object并且能够将其与jsp上的Angular表达式一起使用。以下是步骤我跟着：
的 1。弹簧控制器
在控制器中，在model属性中设置json。例如
mav.addObject("employeeJson", empJson);
确保在将其添加到ModelAttribute之前，用html实体替换引号“否则在解析json时会出错 empJson.replaceAll("\"", "\&\quot;");
的 2。 JSP
使用angular init指令data-ng-init="yourController.getEmployeeData('${employeeJson}')"
第3。在Angular js 中解析这个json以得到json
var vm = this;
vm.employee = {};
vm.getEmployeeData = function(employeeJson){, vm.employee = JSON.parse(employeeJson); };
的 4。在jsp内部
我可以访问员工姓名 {{yourController.employee.firstName}}

AngularJs如何从Spring MVC控制器访问Model Attribute值

2 个答案: