AngularJS中的控制器示例_3

<!doctype html>
<html ng-app="myApp">
	<head>
		<script src="C:\\Users\\yuli\\Desktop\\bower_components\\angularjs\\angular.js"></script>
		<script type="text/javascript">
			var myModule = angular.module(‘myApp‘, []);
			myModule.controller(‘MyController‘, function ($scope, $timeout) {
				var updateClock = function() {
					$scope.clock = new Date();
					$timeout(function() {
						updateClock();
					}, 1000);
				};
				updateClock();

				$scope.a_click = function (msg){
					console.log(msg);
				}
				$scope.value = 1;
				$scope.add = function (n){
					$scope.value += n;
				}

				$scope.clear = function(){
					$scope.value = 0;
				}
			});

			myModule.run(function($rootScope){
				$rootScope.rootValue = -1;
				$rootScope.add_n = function(n){
					$rootScope.rootValue += n;
				};
			});
		</script>
	</head>
	<body>
		<div ng-controller="MyController">
			<h1>Hello {{ clock }}!</h1>
			这是AngularJS的测试程序。
			<a href="" ng-click="a_click(‘hello‘)">click me console.log message.</a>
			<a href="" ng-click="add(2)">add 2.</a>
			<input type="text" ng-model="value"/>

			<br />
			<a href="" ng-click="clear()">clear.</a>
			<br />
			<input type="text" ng-model="rootValue"/>
			<a href="" ng-click="add_n(value)">add n.</a>
		</div>
	</body>
</html

  

时间: 2024-10-12 16:15:21

AngularJS中的控制器示例_3的相关文章

AngularJS中的控制器示例_2

<!doctype html> <html ng-app="myApp"> <head> <script src="C:\\Users\\yuli\\Desktop\\bower_components\\angularjs\\angular.js"></script> <script type="text/javascript"> angular.module('myApp'

AngularJS中的控制器示例

<!doctype html> <html ng-app="myApp"> <head> <script src="C:\\Users\\yuli\\Desktop\\bower_components\\angularjs\\angular.js"></script> <script type="text/javascript"> angular.module('myApp'

AngularJS中的控制器和作用域

欢迎大家指导与讨论 : ) 一. 作用域的事件传播 一 . 1 修改的传播   关于作用域最重要的一点是修改会通过事件传播下去,自动更新所以依赖的数据值,即使是通过行为产生的.简而言之,就是即时您只修改了某个作用域中的某个属性(比如说$scope.data),那么依赖于$scope.data的一些行为(参数含有$scope.data的一些函数),都会重新执行计算.比如下面的这个例子,每当 <input> 被输入不同的对象, getCountry(city) 就会再次计算. <input

angularJS中如何写控制器

angularJS中的控制器是一个函数,用来向视图作用域中添加额外的功能,我们用它来给作用域对象设置初始状态,并添加自定义行为 当我们在页面上创建一个新的控制器时,angularJS会生成并传递一个新的$scope给这个控制器 控制器可以将与一个独立视图相关的业务逻辑封装在一个独立的容器中.尽可能地精简控制器是很好的做法 控制器并不适合用来执行DOM操作.格式化或数据操作,以及除存储数据模型之外的状态维护操作,它只是视图和$scope之间的桥梁. demo.html <!doctype html

AngularJS入门基础——控制器

AngularJS中的控制器是一个函数,用来向视图的作用域添加额外的功能.我们用它来给作用域对象设置初始状态,并添加自定义行为. AngularJS同其他JavaScript框架最主要的一个区别就是,控制器并不适合用来执行DOM操作,格式化或数据操作,以及除存储数据模型之外的状态维护操作.它只是视图和$scope之间的桥梁. AngularJS应用的任何的一个部分,无论它渲染在哪个上下文,都有父级作用域存在.对ng-app所处的层级来讲,它的父级作用域就是$rootScope. 有一个例外,在指

转帖:AngularJS中的数据绑定 post

原文作者:zhangzhaoaaa http://zhangzhaoaaa.iteye.com/blog/2185376 AngularJS中的数据绑定 AngularJS创建实时模板来代替视图,而不是将数据合并进模板之后更新DOM.任何一个独立视图组件中的值都是动态替换的.      ng-app属性声明所有被其包含的内容都属于这个AngularJS应用,这也是我们可以在Web应用中嵌套AngularJS应用的原因.只有被具有ng-app属性的DOM元素包含的元素才会受AngularJS影响.

黄聪:AngularJS中的$resource使用与Restful资源交互(转)

原文:http://blog.csdn.net/he90227/article/details/50525836 1.AngularJS中的 $resource 这个服务可以创建一个资源对象,我们可以用它非常方便地同支持RESTful的服务端数据源进行交互,当同支持RESTful的数据模型一起工作时,它就派上用场了.      REST是Representational State Transfer(表征状态转移)的缩写,是服务器用来智能化地提供数据服务的一种方式 1)我们首先需要引入ng-Re

通过几段代码,理清angularJS中的$injector、$rootScope和$scope的概念和关联关系

$injector.$rootScope和$scope是angularJS框架中比较重要的东西,理清它们之间的关系,对我们后续学习和理解angularJS框架都非常有用. 1.$injector其实是一个IOC容器,包含了很多服务(类似于spring框架中的bean),其它代码能够通过       $injector.get("serviceName")的方式,从injector中获取所需要的服务.详情参考这篇文章 2.scope是angularJS中的作用域(其实就是存储数据的地方)

angularJS中XHR与promise

angularJS应用是完全运行在客户端的应用,我们可以通过angularJS构建一个不需依赖于后端,同时能够实现动态内容和响应的web应用,angularJS提供了将应用与远程服务器的信息集成在一起的方法 $http服务 angularJS提供了内置的$http服务直接同外部进行通信,$http服务封装了浏览器原生的XMLHttpRequest对象 $http服务只接收一个参数对象,包含了用来生成http请求的配置内容,$http函数返回一个promise对象,具有success和error两