java - 渲染 JSP 页面后设置 ng-model

Question

我在项目中使用 AngularJS、Spring MVC 和 JSP。我需要做这种事情:

<div class="hide" ng-app ng-controller="myCtrl">
    <span ng-model="myValue">${valueToRender}</span>
</div>

渲染后，假设我得到了这个 HTML:

<div class="hide" ng-app ng-controller="myCtrl">
    <span ng-model="myValue">42</span>
</div>

我想在 Angular Controller 中访问 myValue 的值，但浏览器显示 myValue 未定义。

这是javascript:

function myCtrl($scope) {
    console.info($scope.myValue); //Browser tells me that is undefined
}

感谢您的帮助。

Answer 1

ng-model不适合这个，除了它只适用于输入元素(不是 <span> s)。我建议使用指令:

目标标记:

<div class="hide" ng-app ng-controller="myCtrl">
    <span server-data="myValue">${valueToRender}</span>
</div>

指令:

angular.module("...").directive("serverData", function() {
    return {
        scope: false,
        link: function(scope, element, attrs) {
            scope[attrs.serverData] = element.text();
        }
    };
});

带有上述 HTML 模板的该指令会将值 "42" (字符串)在范围内，在名称 myValue 下. (此代码未经测试只是为了演示一般想法。)

但是，您确定这是实现客户端-服务器通信的方式吗？