首页 > 代码库 > angurlarjs学习笔记
angurlarjs学习笔记
一些需要记忆的知识点:
1、自定义指令:
app.directive("nameDirective" , function(){
template: ""
});
2、app = angular.module("MyApp", [])
模块定义中,[]表示模块的依赖关系, 应该填写依赖模块的名字, 为null表示没有依赖关系。
3、注意, 一般将angularjs库放到head元素中加载, 而AnJS脚本放到body元素底部加载,原因: 这样会提高网页加载速度,因为html加载不受制于脚本加载。
4、angular.copy() : 复制一个数据到另一个数据 。。
5、在控制器里定义方法, 在控制器里调用方法, 此方法也可以在html中调用。
AnJS 用来代替AJAX 表单提交, 而不是asp.net form表单提交。
6、Form 表单提交 anjs 使用思考:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
< div ng-app="myApp" ng-controller="formCtrl"> < form > First Name:< br > < input type="text" ng-model="user.firstName">< br > Last Name:< br > < input type="text" ng-model="user.lastName"> < br >< br > < button ng-click="reset()">RESET</ button > < button ng-click="submit()">submit</ button > </ form > < p >form = {{user }}</ p > < p >master = {{master}}</ p > </ div > < script > var app = angular.module(‘myApp‘, []); app.controller(‘formCtrl‘, function($scope) { $scope.master = {firstName:"John", lastName:"Doe"}; $scope.reset = function() { $scope.user = angular.copy($scope.master); }; $scope.reset(); $scope.submit = function(){ /// 把 $scope.user 提交到后台, $http, $.ajax , 并获取返回数据< br > /// http 请求 就是 AJAX 请求 }; }); </ script > |
7、 anJS表单 客户端 验证:
input 元素的: required
$dirty : 表单有填写记录,为true , 更改表单就会为true. 只要在表单中改变数据,都为null。
$pristine : 表单没有填写记录, 就是没有更改表单中数据 时, 为true , 一般是刚加载出来 改变数据时,
$valid
$invalid : 为null时,无效 , $invalid 为true
.$error.required
可以模仿使用:
<p>邮箱:<br>
<input type="email" name="email" ng-model="email" required>
<span style="color:red" ng-show="myForm.email.$dirty && myForm.email.$invalid">
<span ng-show="myForm.email.$error.required">邮箱是必须的。</span>
<span ng-show="myForm.email.$error.email">非法的邮箱。</span>
</span>
</p>
8、AngularJS API:
全局API:
angular.lowercase() :
angular.uppercase()
angular.isString():
angular.isNumber() : 判断是否时数字
9、常识: (SSI: Server Side Includes, 服务器端包含)
AngularJS 包含: ng-include="‘html文件路径‘"
10、angularJS 也可以写动画, 利用css ,暂时不多做了解,用的少。
11、依赖注入(Dependency Injection,简称DI)是一种软件设计模式,在这种模式下,一个或更多的依赖(或服务)被注入(或者通过引用传递)到一个独立的对象(或客户端)中,然后成为了该客户端状态的一部分。
AnJS 依赖注入核心组件: [理解不够透彻]
1、value : JS 对象 , 用于向控制器传递值(注入到控制器中)
app.value("","")
2、factory : 是一个函数用于返回值,常用来计算或返回值, 在service 和 controller 需要时创建。
app.factory("Name",function(){});
3、provider 创建一个service , factory 等
app.config(function($provider){
$provider.provider("NameService",function(){ /// provider 创建服务
this.$get = function(){ /// get方法, 创建一个factory,
};
});
});
4、constant , 用来配置阶段传递值
app.constant("", "");
PS: 使用$scope 双向绑定model , 可以在anjs中直接调用$scope变量, 也就是调用anjs函数可以不用传值了。
12、AnJS 路由js文件路径 : http://apps.bdimg.com/libs/angular-route/1.3.13/angular-route.js
$routeProvider 用来定义路由规则 ,,, 实现多视图的单页面访问,在写菜单url很有用。
app.config(["$routeProvider",function($routeProvider){
$routeProvider
.when(‘/‘,{template:"hssdffaffa"})
.when()
.otherwise({redirectTo:"/"});
}]);
来自http://www.cnblogs.com/generalLi/articles/5988096.html
angurlarjs学习笔记