在呈現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。 （這段代碼沒有經過測試只是爲了演示一般想法。）

但是，你確定這是實現客戶端 - 服務器通信的方式嗎？