Angular JS 2
data-ng-bind
<!DOCTYPE html>
<html>
<head>
<meta charset=”EUC-KR”>
<title>Insert title here</title>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js“>
</script>
</head>
<body>
<div ng-app ng-init=”name=’Hong Gil Dong'”>
<p>Name:<span data-ng-bind=”name”></span></p>
</div>
</body>
</html>
계산기
<!DOCTYPE html>
<html>
<head>
<meta charset=”EUC-KR”>
<title>Insert title here</title>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js“>
</script>
</head>
<body>
<div ng-app>
입력1: <input type=”number” ng-model=”f”><br>
입력1: <input type=”number” ng-model=”s”><br>
<p>결과:{{f+s}}</p>
<p>결과:{{f*s}}</p>
</div>
</body>
</html>
JSON 형식과 ng-repeat(for문과 같음)
<!DOCTYPE html>
<html>
<head>
<meta charset=”EUC-KR”>
<title>Insert title here</title>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js“>
</script>
</head>
<body>
<div ng-app ng-init=”sawons=[{sabun:1,name:’홍길동’},{sabun:2,name:’심청이’},{sabun:3,name:’박문수’}]”>
<ul>
<!– for(Sawon s:sawons) –>
<!– BasicDBObject –>
<li ng-repeat=”sa in sawons”>
{{sa.sabun}},{{sa.name}}
</li>
</ul>
</div>
</body>
</html>
오라클 연결해서 앵귤러js rg-repeat로 뿌리기
<%@page import=”java.sql.ResultSet”%>
<%@page import=”java.sql.PreparedStatement”%>
<%@page import=”java.sql.DriverManager”%>
<%@page import=”java.sql.Connection”%>
<%@ page language=”java” contentType=”text/html; charset=EUC-KR”
pageEncoding=”EUC-KR”%>
<%
String data=””;
try{
Class.forName(“oracle.jdbc.driver.OracleDriver”);
String url=”jdbc:oracle:thin:@localhost:1521:ORCL”;
Connection conn=DriverManager.getConnection(url,”scott”,”tiger”);
String sql=”SELECT empno,ename,job FROM emp”;
PreparedStatement ps=conn.prepareStatement(sql);
ResultSet rs=ps.executeQuery();
data=”[“;
while(rs.next()){
data+=”{empno:”+rs.getInt(1)+”,ename:'”+rs.getString(1)+”‘,job:'”+rs.getString(2)+”‘},”;
}
data=data.substring(0,data.lastIndexOf(‘,’));
data+=”]”;
System.out.println(data);
}catch(Exception ex){
System.out.println(ex.getMessage());
}
%>
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd“>
<html>
<head>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js“>
</script>
<meta http-equiv=”Content-Type” content=”text/html; charset=EUC-KR”>
<title>Insert title here</title>
</head>
<body>
<div ng-app ng-init=”emp=<%=data%>”>
<table border=1 width=350>
<tr>
<th>순번</th>
<th>사번</th>
<th>이름</th>
<th>직위</th>
</tr>
<tr ng-repeat=”e in emp”>
<td>{{$index}}</td>
<td>{{e.empno}}</td>
<td>{{e.ename}}</td>
<td>{{e.job}}</td>
</tr>
</table>
</div>
</body>
</html>