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

最新推荐文章于 2017-10-03 14:37:02 发布

方长君

最新推荐文章于 2017-10-03 14:37:02 发布

阅读量654

点赞数

分类专栏：学习笔记入门基础文章标签： javascript angularjs

本文链接：https://blog.csdn.net/hjjxiaoxiaobai/article/details/51944514

版权

学习笔记入门基础专栏收录该内容

17 篇文章 0 订阅

订阅专栏

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

方长君

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
AngularJs 基础教程（一）我的第一个angularjs程序

本文为H5EDU机构官方的HTML5培训教程，AngularJs 基础教程，AngularJs 教程将带领大家对angularjs有一个基础的了解这一节我们将介绍如何开始一个新的Angularjs 程序 testApp {{test}} var module=angular.module("testApp",); modu
复制链接

扫一扫