close

MVC:

1.Model:

通常存在資料庫

伺服端有可存取與更新模型的程式

更新完成後,發訊息至Controller

2.Controller

Controller或ViewModel

檢視資料是否更新

更新資料模型

data binding

3.View

不同資料不同檢視(使用者和管理者看到的不同)

 

 

<!DOCTYPE html>
<html lang="en" ng-app>
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
</head>
<body>
	<div ng-controller='mealCtrl'>
		<h2 id="main">主餐:{{main}}</h2>
		<h2 id="beverage">飲料:{{beverage}}</h2>
		<h2 id="price">價格:{{price}}</h2>
		<img src="{{pic}}"><br>
		<input type="number" ng-model="quantity">
		<h2>小計:{{quantity * price | currency}}</h2>
	</div>
	<script type="text/javascript">
		function mealCtrl($scope){
			$scope.main='漢堡';
			$scope.beverage='可樂';
			$scope.price=100;
			$scope.pic="https://api.fnkr.net/testimg/100x100/a00/FFF/?text=A";
			$scope.quantity=1;
		}
	</script>
</body>
</html>

arrow
arrow
    全站熱搜
    創作者介紹
    創作者 Jerry 的頭像
    Jerry

    Bug倉庫 // 程式日記

    Jerry 發表在 痞客邦 留言(0) 人氣()