angular js 各种功能函数介绍

来源:互联网 发布:浙师大行知学院 编辑:程序博客网 时间:2024/04/29 12:24

    把angular js 的一些功能函数记录下来,就相当于做做笔记!!

1.angualar.bind  :将对象绑定进 函数中,

   如:

varobj = { name: "Any"};
varfn = function(Adj) {
  console.log(this.name + "is a boy!!! And he is " + Adj + " !!!");
};
varf = angular.bind(obj, fn, "handsome");
f();//Any is a boy!!! And he is handsome!!!

第一个参数为对象,第二个为要绑定的函数,第三个为可选是传到函数中的参数。


2.angular.bootstrap : 可用于模块的手动加载。
  <body>    <div id="div2"  ng-controller="controller2">div2:{{name}}</div>  </body>
var m2 = angular.module('moudle2', []);    m2.controller("controller2",function($scope){$scope.name="aty"});        // 页面加载完成后,再加载模块    angular.element(document).ready(function() {      angular.bootstrap(document.getElementById("div2"),["moudle2"]);    });

3.angular.copy :  用于对象和数组的复制。

angular.copy(source, [destination]);

source:为数据源(要复制的东西)

destination: 为目的地。(可以为数组或者对象)


4. angular.element

angular 中内置了 一个jquery 的子集jqLit​​e。

jqLit​​e的jQuery是一个微小的,API的兼容子集,允许角操纵一个跨浏览器兼容的方式DOM。jqLit​​e具有一个非常小的足迹的目标只实现了最常用所需的功能

    angular.element 可以传入dom 元素返回一个jquery 对象。

 angular.element(document).css("class","isChen");


注:该子集jqLit​​e 仅支持一下方法:

  • addClass() - 不支持一个函数作为第一个参数
  • after()
  • append()
  • attr() - 不支持函数作为参数
  • bind() - 不支持命名空间,选择或EVENTDATA
  • children() - 不支持选择
  • clone()
  • contents()
  • css()-只检索直列风格,不叫作为一名二传手,没有数字转换为字符串或追加“PX”,也没有自动属性前缀。getComputedStyle()
  • data()
  • detach()
  • empty()
  • eq()
  • find() - 通过标签名限于查询
  • hasClass()
  • html()
  • next() - 不支持选择
  • on() - 不支持命名空间,选择或EVENTDATA
  • off() - 不支持命名空间,选择或事件对象作为参数
  • one() - 不支持命名空间或选择
  • parent() - 不支持选择
  • prepend()
  • prop()
  • ready()
  • remove()
  • removeAttr()
  • removeClass() - 不支持一个函数作为第一个参数
  • removeData()
  • replaceWith()
  • text()
  • toggleClass() - 不支持一个函数作为第一个参数
  • triggerHandler() - 通过一个虚拟事件对象来处理
  • unbind() - 不支持命名空间或事件对象作为参数
  • val()
  • wrap()

都是jquery 的函数,不懂自已看文档,我就不说了。



5.angular.equals

确定两个对象或两个值是相等的。支持值类型,正则表达式

比较两个值是要值相等类型相当才返回true,

比较两个对象的话是用angular.equals 比较其属性才判断。

6.angular.extend()

方法可以把一个或多个对象中的方法和属性扩展到一个目的对象中,使得这个对象拥有其他对象相同的方法和属性,angular.extends()方法的第一个参数是要被扩展的对象,后面可以传入一个或多个对象。

如: angular.extend($scope.human, $scope.baby, $scope.adult);  

  1.  $scope.human.lover.love = function()  
  2.                         {  
  3.                             console.log("I hate you!");  
  4.                         }  
  5.   
  6.                         <!-- 这两行都会输出“I hate you !",可怜的adult对象,  
  7.                         他把自己的lover分享给了human! -->  
  8.                         $scope.human.lover.love();  
  9.                         $scope.adult.lover.love();  

因为human 扩展了adult 的属性,即是 human  引用了adult 对象。分享了他的属性。。


7.angular.foreach   迭代器,这个大家应该很熟悉吧

例子:

var values = {name: 'misko', gender: 'male'};var log = [];angular.forEach(values, function(value, key) {  this.push(key + ': ' + value);}, log);

第一个参数为迭代的对象获取数组。

第二个为迭代函数。


8.angular.fromJson();

将json 字符串 反序列化为对象,或者数组

9.angular.toJson

将对象获取数组序列化为 字符串。


10.angular.injector

可用于创建一个injector对象, 调用injector对象的方法可以获得angular的service, 或者用来做依赖注入.

使用方法:
angular.injector(modules, [strictDi])
 
参数详解:
Param Type DetailsmodulesArray.<string|Function>

一组module或者他们的别名. ng module需要显示地申明出来.

strictDi
(optional)
boolean

Injector需不需要使用严格模式,即允不允许使用默认别名

(default: false)

返回值:
Injector对象.
 
应用场景:  Angular的app 已经启动编译好了之后, 有时候你又想强行进入做一些逻辑或者修改,可以使用JQuery/jqLite元素的injector()方法

例子:

exampleApp.controller('exampleController',['$scope', function($scope){$scope.name = "boyi";$scope.inject = function(){var $injector = angular.injector(['ng']);$injector.invoke(function($http) {var scopes = angular.element(document.body).scope();scopes.name = "博弈网络";//这里可以同http请求获得数据});};}]);
如上在conntroller 中并无注入$ http 服务但是可以通过angular.injector 获取的$injector  对象重新进行注入新的服务。

可用于测试和加载后手动注入。


11.

angular.isArray  判断参数是否 数组


12.    

angular.isDate   判断参数是否为日期


  13,.

angular.isDefined  判断参数是否已经被定义

   
  14.

angular.isElement  判断参数是DOM元素(或包装jQuery的元素)


  15.angular.isFunction  判断参数是函数

  16.angular.isNumber  判断参数是数字


  17.angular.isObject   判断参数是对象

  18.angular.isString   判断参数是字符串


  19.  angular.merge 与 copy 和extend 相似, 不过merge 是深度复制。
详情请点击http://davidcai.github.io/blog/posts/copy-vs-extend-vs-merge/

  20.angular js 里最重要的功能:angular.module

它可用于模块的创建和获取

关于module函数可以传递3个参数,它们分别为:

  1. name:模块定义的名称,它应该是一个唯一的必选参数,它会在后边被其他模块注入或者是在ngAPP指令中声明应用程序主模块;
  2. requires:模块的依赖,它是声明本模块需要依赖的其他模块的参数。特别注意:如果在这里没有声明模块的依赖,则我们是无法在模块中使用依赖模块的任何组件的;它是个可选参数。
  3. configFn: 模块的启动配置函数,在angular config阶段会调用该函数,对模块中的组件进行实例化对象实例之前的特定配置,如我们常见的对$routeProvider配置应用程序的路由信息。它等同于”module.config“函数,建议用”module.config“函数替换它。这也是个可选参数。
  module 是angular 代码的入口,有了module 才可以定义其他组件如:controller,service,config

 






1 0
原创粉丝点击