AnglarJs的一些笔记

AnglarJs是什么? 为什么要学Anglarjs
AngularJS是一款由Google公司开发维护的前端MVC框架;
1>克服了HTML在构建应用上的诸多不足,从而降低了开发成本提升了开发效率;
Anglarjs的特点:
AngularJS则一个框架(诸多类库的集合)以数据和逻辑做为驱动(核心)。
框架对开发的流程和模式做了约束,开发者遵照约束进行开发,更注重的实际的业务逻辑。
AngularJS有着诸多特性,最为核心的是:模块化、双向数据绑定、语义化标签、依赖注入等。
与之类似的框架还有BackBone、KnockoutJS、Vue、React等.

准备环境

下载anglarJs的包: 封装js代码
ng下表达式
1.1 表达式练习:通过表达式把模型的数据显示出来
{{ 模型名}}
可以把模型层的数据,显示到视图HTML
1.1.1 算数练习
{{1+2}}=====>输出3
1.1.2 拼接字符串
{{模型名+”字符串” }}
1.1.3 关系运算
关系运算: {{9>2}}
1.1.4 逻辑运算
1.2 Angular指令: 加在html标签上
1.2.1 ng-app:一般一个网页写一个指令, 指令放在body中,或者html标签中
1.2.2 ng-init:在html中声明变量:

<p 
ng-init="变量名=字符串''|数组[]|对象{}";
>

1.2.3 ng-modle: 用在输入框,把输入框当模型
1.2.4 ng-click: 点击事件,调用的ng的控制器的方法
1.2.5 ng-repeat: 遍历数组; ng-repeat=”stu in stus”
1.2.6 ng-show : ng-show=’true|1’ 值为true表示显示
1.2.7 ng-hide : ng-hide=”false|0” 值为true表示隐藏
1.2.8 ng-bind:
输出模型数据,类似{{ 模型名 }}
1.3 模型ng-model指令
用在输入框中,把输入框作为模型层

1.4.1 如何创建控制器
1.4 控制器:在控制器声明数据—>通过网页html可以显示
1>创建模块:var app= angular.module(“gaoynApp”,[]); //参数一模块名字
2>通过模块来创建控制器:app.controller(“deomCtrl”,[“scope",function( scope){} }
2.1 变量名 : scope.name=gaoyn;2.2: scope.函数名=function(){ }
3>ng-app ng-Controller 使用指令来显示 {{ name }}

1.3.1 理解MVVM

1.4.2 $scope:子作用域(控制内),局部变量

$rootScope:根作用域,全局变量

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章