什么是angularJS?
angularJs是谷歌推出的一款前端框架. 核心思想是前端mvc开发. 底层使用Js语言编写.
angularJs采用html页面+ js来进行操作, 所有angularJs提倡整个网站都是ajax操作.
angularJs是一个重型的前端框架. angularJs比较适合管理系统的页面开发.
使用angularjs: 使用fireFox, chrom浏览器可以使用.
angularJs语法:
1. 使用angular技术页面必须引入angularjs核心包
2. 使用angularjs, 页面的body标签必须加入ng-app指令, 表示当前页面使用angularjs, 指定使用的模块名称
ng-controller指定使用的控制器名称
3.
s
c
o
p
e
:
它
是
a
n
g
u
l
a
r
j
s
的
内
置
对
象
,
就
是
a
n
g
u
l
a
r
j
s
中
自
带
的
对
象
,
我
们
请
求
的
数
据
,
响
应
的
数
据
,
定
义
的
方
法
,
全
部
都
在
scope: 它是angularjs的内置对象, 就是angularjs中自带的对象, 我们请求的数据, 响应的数据, 定义的方法, 全部都在
scope:它是angularjs的内置对象,就是angularjs中自带的对象,我们请求的数据,响应的数据,定义的方法,全部都在scope中,
s
c
o
p
e
作
用
域
范
围
是
当
前
页
面
,
每
个
页
面
都
有
自
己
的
scope作用域范围是当前页面, 每个页面都有自己的
scope作用域范围是当前页面,每个页面都有自己的scope
4. 使用angularjs页面展示数据:使用两个大括号语法 {{表达式或者变量}}, 如果两个大括号中写的是变量, 那么会
自动到当前页面的
s
c
o
p
e
域
范
围
中
查
找
这
个
变
量
的
值
显
示
5.
页
面
元
素
绑
定
n
g
−
m
o
d
e
l
:
n
g
−
m
o
d
e
l
绑
定
的
数
据
会
被
自
动
放
入
当
前
页
面
的
scope域范围中查找这个变量的值显示 5. 页面元素绑定ng-model: ng-model绑定的数据会被自动放入当前页面的
scope域范围中查找这个变量的值显示5.页面元素绑定ng−model:ng−model绑定的数据会被自动放入当前页面的scope域中
6. 初始化指令ng-init: ng-init指令必须写在页面的body标签中, 如果页面上有这个指令则页面一加载首先执行这个指令
中的内容.
7. angularjs中自定义模块语法:
myApp是我们自己定义的控制器的名称, 第二个参数方括号是传入空的数组, 如果在项目中
是需要传入使用的angularjs插件的名称, 我们这里没有使用插件则传入空的数组
var app=angular.module(‘myApp’,[]);
8. angularjs中自定义控制器语法:
myController是我们自己定义的控制器的名称
注意: angularjs中所有需要使用到的方法, 都会被定义到
s
c
o
p
e
域
中
,
调
用
方
法
的
时
候
也
是
从
scope域中, 调用方法的时候也是从
scope域中,调用方法的时候也是从scope域中
进行调用,
s
c
o
p
e
域
中
定
义
方
法
需
要
写
在
控
制
器
中
,
控
制
器
在
模
块
中
.
a
p
p
.
c
o
n
t
r
o
l
l
e
r
(
′
m
y
C
o
n
t
r
o
l
l
e
r
′
,
f
u
n
c
t
i
o
n
(
scope域中定义方法需要写在控制器中, 控制器在模块中. app.controller('myController',function(
scope域中定义方法需要写在控制器中,控制器在模块中.app.controller(′myController′,function(scope){
KaTeX parse error: Expected '}', got 'EOF' at end of input: …eturn parseInt(scope.x)+parseInt($scope.y);
}
});
9. 鼠标单击指令ng-click: ng-click指鼠标的单击事件, angularjs中叫做鼠标单击指令
10. 循环指令ng-repeat:
{{临时变量}}
11. angularJs中的ajax访问:
$http是angularjs的内置对象, 作用是发送ajax请求到后端, 请求数据.
$http.get是发送get请求, $http.post是发送post请求
$http.get(‘data.json’).success(
function(response){
$scope.list=response;
}
);
12. 分页:
a. 页面引入angularjs分页插件, 包括js和css
b. 页面一加载首先执行分页标签
c. 由于分页标签中有属性, 所以加载paginationConf属性, 这个属性是一个json数据, 数据格式是
angularjs分页插件固定的格式
d. 由于是页面初始化, 所以默认会执行一次这个paginationConf属性中的onChange方法,
这个方法中可以调用其他js方法, 发送ajax请求到后端查询数据并返回,
返回的数据一共包含两个东西, 一个是查询到的结果集, 一个是查询到的数据的总数
13. $event是angularjs的内置对象, 作用就是通过它可以知道当前的操作
angularJS简介
最新推荐文章于 2024-07-11 15:59:35 发布