AngularJS + Java---前台網頁與后台數據庫傳遞數據 基本結構

第一個關於這兩種語言的項目，以下只是我自己的理解，歡迎指教:)

基本對應關系

1. controller

.jsp(.html)  ng-controller="controllerTest"

.js              angular.module('appTest',[]).controller('controllerTest',[])

/*ng-app="appTest" 指定angularJS的根元素*/

 

2.click

.jsp(.html) ng-click="functionTest()"

.js      　　 $rootScope.functionTest = function(){

　　　　　　　　$http.get("../loadData").success(function(data){

　　　　　　　　　　$rootScope.dataTest = data.

　　　　　　　　})

　　　　　　}

 

3.load/update

.js

$rootScope.functionLoad = function(){

　　$http.get("../loadData").success(function(data){ //與后台java中的路徑對應
　　　　$rootScope.dataTest = data.data;
　　})

}

/*通過JSON傳遞數據*/
$rootScope.functionUpdate = function(){
　　var paraData = JSON.stringify({
　　　　name:$rootScope.name //ng-model="name" 寫在<form></form>的控件中
　　})

　　$http.post("../updateData"，paraData).success(function(data){
　　　　
　　})
}

.jsp(.html)

顯示數據在table中

<tbody>
    <tr ng-repeat="data in dataTest">
        <td ng-bind="data.name"></td>
    </tr>
</tbody>

 更新form中的數據

<form>
　　<div>
    　　<label>Name:</label>
       <div>
           <input  ng-model="name"/>
       </div>
   </div>
</form>

 

Java中需要創建的interface/class

1.controller(class)

這個controller本身與angularJS中的controller沒有關系，兩者是根據url來進行連接的。

所以只要在js和java中GET/POST的路徑相同，就可以觸發java中的代碼。

 

2.service(interface/class)

interface: import model;

class: import model; import dao;

返回dao中的結果

 

3.dao(interface/class)

import model;

Criteria語句，這部分也可以用sql來寫

 

4.model(class)

為數據庫中的table創建對應的class，直接連接數據庫