AngularJs是一个 mvvm框架,可通过<script></script>标签绑定到html
angular可以构建一个单一页面应用程序(SPA:single Page Applications)
Angular指令
ng-app 定义一个AngularJs应用程序
ng-model 数据的双向绑定
ng-bind 数据的单向绑定
ng-init指令初始化应用程序数据
ng-repeart指令对于集合中(数组中)的俄每个项会克隆一次html元素
ng-class设置样式
ng-controller创建一个控制器
ng-if显示隐藏
ng-show显示
ng-hide隐藏
ng-repeat遍历添加对应内容
ng-repeat-start开始循环
ng-repeat-end结束循环
track by $index定义
$rootScope和$scope的区别:
$rootscope相当于全局变量
定义的$rootscope在其他控制器coontroller里可以访问,而$scope只能访问当前的controller
$watcher 监听
$digest 脏值检查 遍历
$apply()方法 可以触发$digest循环
Angular过滤器
改变显示方法
1.|currency(保留小数点后两位)
|currency:“¥”(显示人名币)
2.过滤日期
|data 日期过滤 May 11. 2017
|data:"yyyy-MM-dd" 年月日
|data:“shortDate” 月/日/年
||data:"yyyy-MM-dd HH:mm:ss"年-月-日时:分:秒
3.过滤数组
|Filter搜索效果
4.过滤json
|json数据显示json格式
5.过滤limitTo数组或字符串
|limitTo:3截取数组前3项
6.|lowercase全部小写aBcDe--->abcde
7.|number如果字符串里边含有非数字的,则返回空串
|number:3保留三位小数
8.|orderBy:参数是字符窜,
9.|upercase全部大写aBcDe--->ABCDE
什么是angular?
angularjs是为了克服html在构建应用上的不足而设计的
是一个动态web应用设计的结构框架,能使用html作为模板语言,通过扩展html语法,让你能更清楚,简洁的构建应用组件
核心:依赖注入 数据双向绑定
Angular.js中ng-if、ng-show和ng-hide的区别介绍
ng-show,ng-hide和ng-if的区别介绍
ng-sjow,ng-hide通过修改css样式控制元素的显示隐藏
ng-if根据自己的表达式的值动态的在当前页面中添加删除页面元素
angular路由:
1、载入了实现路由的 js 文件:angular-route.js。
2、包含了 ngRoute 模块作为主应用模块的依赖模块。
angular.module('routingDemoApp',['ngRoute'])
3、使用 ngView 指令。
该 div 内的 HTML 内容会根据路由的变化而变化。
4、配置 $routeProvider,AngularJS $routeProvider 用来定义路由规则。
module.config(['$routeProvider', function($routeProvider){
$routeProvider
.when('/',{template:'这是首页页面'})
.when('/computers',{template:'这是电脑分类页面'})
.when('/printers',{template:'这是打印机页面'})
.otherwise({redirectTo:'/'});
}]);
网友评论