Angular基础（二）

最新推荐文章于 2024-10-10 10:50:43 发布

baifen2379

最新推荐文章于 2024-10-10 10:50:43 发布

阅读量45

点赞数

文章标签： javascript 测试 ViewUI

原文链接：http://www.cnblogs.com/weiyz/p/7077888.html

版权

双向数据

利用angular把input框里面的值和h3的值绑定在一起。在input里输入内容，内容会在h3标签里显示出来。

具体效果请看下面代码：

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title></title>
	</head>
	<body ng-app="app">
	<!--ng-controller控制器控制的就是angular应用程序的数据常规的js对象
	move函数是一个js函数
	-->
	<div ng-controller="move">
	<input type="text" ng-model="name"/>
	<h3>{{name}}</h3>
	</div>
	</body>
	<script type="text/javascript" src="js/angular.min.js" ></script>
	<script type="text/javascript">
	var app = angular.module("app",[]);
	// 使用$scope来调用控制器
	// $scope相当于作用域控制范围
	app.controller("move",function($scope){
	$scope.name = "abcd"
	})
	// mvc m:model 模型即当前视图中可用的数据
	// v:view 视图即html
	// c:controller 控制即js函数，可以添加和修改的属性
	</script>
	</html>