在呈现JSP页面后设置模型页面

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> 

我想，在角控制器，访问值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。 （这段代码没有经过测试只是为了演示一般想法。）

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