Spring Boot & JPA 실무 과정 자료]AngularJS와 연동2
Spring Boot & JPA 실무 과정 자료] AngularJS와 연동2
실무개발자를위한 실무교육 전문교육센터학원
www.oraclejava.co.kr에 오시면 보다 다양한 강좌를 보실 수 있습니다.
AngularJS와 연동2
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>Insert title here</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script th:inline="javascript">
//모듈 작성
var app = angular.module('phoneApp', []);
var contextRoot = /*[[@{/}]]*/'';
//컨트롤러 작성
app.controller('phoneCtrl', function($scope, $http){
$http.get(contextRoot + "api/phones")
.success(function(data) {
$scope.phones = data;
});
});
</script>
</head>
<body>
<div ng-app="phoneApp" ng-controller="phoneCtrl">
<table border="1">
<tr>
<th>id</th><th>name</th><th>price</th>
</tr>
<tr ng-repeat="p in phones">
<td>{{p.id}}</td>
<td>{{p.name}}</td>
<td>{{p.price}}</td>
</tr>
</table>
</div>
</body>
</html>
'자바 > Spring Boot & JPA' 카테고리의 다른 글
| Spring Boot & JPA 실무 과정 자료]JPA란? (0) | 2017.07.28 |
|---|---|
| Spring Boot & JPA 실무 과정 자료]Spring Data JPA의 전체 구조 (0) | 2017.07.28 |
| Spring Boot & JPA 실무 과정 자료]AngularJS와 연동 (0) | 2017.07.27 |
| Spring Boot & JPA 실무 과정 자료], Thymeleaf 라는 뷰 템플릿엔진을 이용 (0) | 2017.07.27 |
| Spring Boot & JPA 실무 과정 자료]MVC에 근거한 컨트롤러 (0) | 2017.07.27 |