作为一个web前端单页面应用程序构建框架,其构建的基本单位当然是 应用程序(app),而作为本系列教程的第一篇,ng-app理解起来当然也是十分的简单。下面直接贴代码,然后详细进行解释。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
//引入AngularJS的库文件
<script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>
//声明AngularJS应用
<div ng-app>
//AngularJS表达式
<p>我的第一个AngularJS应用: {{ "Hello" + "World!" }}</p>
</div>
</body>
</html>
运行结果
由代码可见:
1、在构建AngularJS之前,首先引入AngularJS的库文件,AngularJS是以javascript文件的形式发布的,所以可以通过script标签添加到我们创建的文件中,在引用时,也可先将其库文件下载到本地后进行本地的引用,AngularJS库文件下载。
2、本程序中通过指令ng-app将div元素声明为应用程序的根元素,通过ng-app指令,我们就创建了一个AngularJS应用。在AngularJS中,每个应用程序都必须有一个根元素,一个HTML文档中只允许有一个ng-app指令,如果存在多个ng-app指令,则只有第一个会生效。
3、表达式的使用使得HTML文档更加具有活力,表达式内容包含在双大括号{{ expression }}中,可进行所有基本的运算以及判断。
到此,我们就轻松地利用ng-app指令创建了我们的第一个AngularJS应用程序,是不是很简单呢。