AngularJs 基础教程（一）我的第一个angularjs程序

发布时间：2020-12-17 10:03:30 所属栏目：安全来源：网络整理

导读：本文为 H5EDU 机构官方的 HTML5培训教程， AngularJs 基础教程， AngularJs 教程将带领大家对angularjs有一个基础的了解这一节我们将介绍如何开始一个新的Angularjs 程序 html ng-app="testApp"headtitle testApp /title script src="js/angular.min.js"

本文为 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”

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

AngularJs 基础教程 （一） 我的第一个angularjs程序

AngularJs 基础教程（一）我的第一个angularjs程序