一、第一个AngularJS应用
<!DOCTYPE html>
<html
ng-app
>
<head>
<title>angularjs</title>
<script type="text/javascript" src="./angular-1.6.9/angular.js"></script>
</head>
<body>
<div>{{"hellow world"}}</div>
<div>{{"hellow angularJs"}}</div>
</body>
</html>
1.
ng-app
是AngularJS的一个内置指令，可以出现在任意位置，并有两个作用，一个是启动AngularJS框架，另一个是告诉AngularJS框架从
ng-app
指令所在的标签的开始标签到结束标签之间的所有DOM元素由AngularJS框架进行管理。通常情况下会将
ng-app
放在<html>标签中，让AngularJS管理整个页面
2.
{{}}
是AngularJS的表达式形式，由两个嵌套的大括号构成，大括号中间为表达式内容，AngularJS会对表达式内容进行解析，然后将表达式结果输出到浏览器
二、AngularJS应用构成元素
1.模型(Model)：AngularJS程序中用于展示到页面的数据，本质是一个JavaScript对象
2.视图(View)：AngularJS指令与表达式经过解析后的DOM元素，即用户看到的界面
3.控制器(Controller)：AngularJS应用中用于处理业务逻辑的JavaScript方法
4.作用域(Scope)：可以把作用域理解为一个容器，在控制器中可以访问这个容器，然后在容器中放入一些模型 数据，在视图中就可以通过表达式将数据展现给用户
5.指令(Directives)：扩展的HTML属性或标签，能够被AngularJS框架识别，根据不同的指令执行相应的动作
6.表达式(Expressions)：AngularJS以HTML作为模板语言，AngularJS模板实际上就是HTML片段
三、AngularJS表达式
1.表达式的定义方式：
{{expression}}
2.表达式中的四则运算
AngularJS表达式支持加减乘除四则运算及字符串拼接运算
3.表达式中的逻辑运算
AngularJS表达式支持逻辑运算，如：<div>1 || 0 =
{{1||0}}
</div>
4.表达式与作用域
AngularJS表达式可以访问作用域中的数据，把数据输出到HTML页面
<body
ng-init
="person={'name':'cai'};arr=['angularjs','jquery']">
<div>
{{person.name}}
</div>
<div>
{{arr[0]}}
</div>
</body>
注：
ng-init
指令用于初始化作用域
扫一扫
230
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
