AngularJs 基础教程 (一) 我的第一个angularjs程序

前端之家收集整理的这篇文章主要介绍了AngularJs 基础教程 (一) 我的第一个angularjs程序前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
本文为 H5EDU 机构官方的 HTML5培训 教程, AngularJs 基础教程 AngularJs 教程
将带领大家对angularjs有一个基础的了解
这一节我们将介绍如何开始一个新的Angularjs 程序
<html ng-app="testApp">
<head>
	<title> testApp </title>
  	<script src="js/angular.min.js"></script>
</head>
<body  >
	<div ng-controller="test1">
        {{test}}
	</div>
	<script >
		var module=angular.module("testApp",);
		module.controller("test1",function($scope){
			$scope.test="欢迎来到www.h5edu.cn";
		});
	</script>
</body>
</html>


1.引入angularjs的基础文件 例如代码中:
<script src="js/angular.min.js"></script>这个源文件大家可以自行下载也可以在我上传的附件中得到
2.通过ng-app指令确定angularjs的作用范围:
<html ng-app="testApp">
3.通过ng-controller指令声明控制器的作用范围 并给该控制器命名
<div ng-controller="test1">
4.在js的标签中声明module,该模块的作用范围就是ng-app的作用范围
var module=angular.module("testApp",);
5.声明控制器,通过module对象下的controller函数声明控制器,
module.controller("test1",function($scope)
6.在控制器的作用域下声明一个变量并赋值
$scope.test="欢迎来到 www.h5edu.cn";
7.通过绑定的方法在视图中绑定作用域中声明的变量,实现在页面显示“欢迎来到www.h5edu.cn” 原文链接:https://www.f2er.com/angularjs/149177.html

猜你在找的Angularjs相关文章