angularJs 基础学习

1、

<body ng-app>
        {{111}}
<body>

2、

<div ng-app=“”>
        <input type=“text" ng-model=“name” value=“”/>
        {{name}}
div>

3、解决加载时间问题、有限加载表达式

ng-bind=“name”

4、$scope 中的 apply 方法
原始:
angularJs 基础学习_第1张图片

angularJs 基础学习_第2张图片
angularJs 基础学习_第3张图片
angularJs 基础学习_第4张图片
angularJs 基础学习_第5张图片
5、
angularJs 基础学习_第6张图片
angularJs 基础学习_第7张图片

6、循环遍历以及方法返回
angularJs 基础学习_第8张图片
angularJs 基础学习_第9张图片

输入刷新
angularJs 基础学习_第10张图片

7、模块
angularJs 基础学习_第11张图片

angularJs 基础学习_第12张图片

angularJs 基础学习_第13张图片
8、provider
angularJs 基础学习_第14张图片

angularJs 基础学习_第15张图片

angularJs 基础学习_第16张图片
angularJs 基础学习_第17张图片

9、多个控制器共享数据
angularJs 基础学习_第18张图片

angularJs 基础学习_第19张图片

10、angular 过滤器
angularJs 基础学习_第20张图片

angularJs 基础学习_第21张图片
angularJs 基础学习_第22张图片

这里写图片描述

angularJs 基础学习_第23张图片

angularJs 基础学习_第24张图片

angularJs 基础学习_第25张图片

这里写图片描述

列表搜索:
angularJs 基础学习_第26张图片

ng-model=“search.id"

angularJs 基础学习_第27张图片

排序:
‘-’代表反向排序
orderType为字符串,orderBy 通过此来排序,所以 click 事件里
传入需要排序的字段即可
angularJs 基础学习_第28张图片

angularJs 基础学习_第29张图片

自定义过滤器
angularJs 基础学习_第30张图片

angularJs 基础学习_第31张图片

angularJs 基础学习_第32张图片

正确使用 controller
angularJs 基础学习_第33张图片

angularJs 基础学习_第34张图片
angularJs 基础学习_第35张图片
内置指令
angularJs 基础学习_第36张图片
angularJs 基础学习_第37张图片

事件指令
angularJs 基础学习_第38张图片
节点指令
angularJs 基础学习_第39张图片

自定义指令
angularJs 基础学习_第40张图片
angularJs 基础学习_第41张图片

angularJs 基础学习_第42张图片

angularJs 基础学习_第43张图片

angularJs 基础学习_第44张图片

angularJs 基础学习_第45张图片

angularJs 基础学习_第46张图片

angularJs 基础学习_第47张图片

angularJs 基础学习_第48张图片

angularJs 基础学习_第49张图片

不常用
angularJs 基础学习_第50张图片

angularJs 基础学习_第51张图片

angularJs 基础学习_第52张图片

angularJs 基础学习_第53张图片

angularJs 基础学习_第54张图片

angularJs 基础学习_第55张图片

angularJs 基础学习_第56张图片

angularJs 基础学习_第57张图片

angularJs 基础学习_第58张图片

angularJs 基础学习_第59张图片

angularJs 基础学习_第60张图片

angularJs 基础学习_第61张图片

angularJs 基础学习_第62张图片

angularJs 基础学习_第63张图片

angularJs 基础学习_第64张图片
angularJs 基础学习_第65张图片

angularJs 基础学习_第66张图片

@双向绑定不能是对象
angularJs 基础学习_第67张图片

angularJs 基础学习_第68张图片

angularJs 基础学习_第69张图片


案例:

自定义指令:according 指令
折叠效果
angularJs 基础学习_第70张图片
angularJs 基础学习_第71张图片
angularJs 基础学习_第72张图片
angularJs 基础学习_第73张图片

constant、value、run 方法
angularJs 基础学习_第74张图片

这里写图片描述

angularJs 基础学习_第75张图片

angularJs 基础学习_第76张图片
angularJs 基础学习_第77张图片

angularJs 基础学习_第78张图片
angularJs 基础学习_第79张图片

angularJs 基础学习_第80张图片
angularJs 基础学习_第81张图片

你可能感兴趣的:(angularJs)