Angular重拾,一个简单demo


后端

零度逍遥

2015-06-12 01:59:56

很久没有弄过angular了,最近心血来潮,又学了一下。

index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <style type="text/css">
    	.active{font-size: 20px;}
    </style>
</head>
<body ng-app="mainApp" ng-controller="mainCtrl">
	<div ng-include="'1.html'"></div>
	<div ng-include="'2.html'"></div>
	<div>{{data.broadcast}}</div>
	<div ng-repeat="b in data.broadcast">{{b}}{{$index+1}}</div>
	<div ng-repeat="b in data1.stage.array">
		<div ng-if="b.number>15">期数:{{b.number}}</div>
		<div data = "{{b.everyStage}}" ng-click="move(b.number)">每期金额:{{b.everyStage}}</div>
		<div ng-class="{active:b.total>40000}" data="true" ng-click="change($event.target)">总额:{{b.total}}</div>
	</div>
</body>
<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/mainApp.js" type="text/javascript" charset="utf-8"></script>
<script src="js/ctrl.js" type="text/javascript" charset="utf-8"></script>
</html>
1.html

<p>width:{{width}}</p>
2.html

<p>height:{{height}}</p>
<p ng-repeat="a in data">{{a.name}}</p>
mainApp.js

var mainApp = angular.module('mainApp',[]);
ctrl.js

mainApp.controller('mainCtrl',function ($scope,$http) {
	$scope.width = 2300;
	$scope.height = 3300;
	/*$http.get("/gshpay/recommend/home").success(function (data) {
		$scope.data = data.object;
	})*/
	$scope.data = [{'id':1,'name':'john'},{'id':2,'name':'tom'},{'id':3,'name':'jack'}]
	
	$http.get("/gshpay/goods/426").success(function (data) {
		$scope.data1 = data.object;
	})
	$scope.move = function (index) {
		/*var id = index.getAttribute('data');
		alert()*/
		alert('删除第'+index+'个元素')
	}
})