Angular - - angular.bind、angular.bootstrap、angular.copy
angular.bind
返回一个调用self的函数fn(self代表fn里的this).可以给fn提供参数args(*).这个功能也被称为局部操作,以区别功能。
格式:angular.bind(self,fn,args);
self:object 对象; fn的上下文对象,在fn中可以用this调用
fn:function; 绑定的方法
args:传入fn的参数
使用代码:

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

bind顾名思义绑定的意思,那么假如我们要把A绑到B上,那么必须又有绑定的东西和被绑定 的东西。这里需要的就一个对象和一个函数。那么怎么绑?野兽的理解是把对象“绑”到函数的this上去执行,这时候fn的this就等于obj了,至于第 三个参数,可有可无,看需求,如果函数需要传入参数,那么我们可以把angular.bind的第三个参数放上去,这就是传入fn函数的参数了。
案例中第一种写法是定义绑定的时候就把fn所需的参数传进去了,调用的时候直接用,而案例中第二种写法是先绑定,在调用执行的时候再给fn传参,效果是一样的...
angular.bootstrap
使用这个功能来手动启动angular应用。基于ngScenario的端对端测试不能使用bootstrap手动启动,需要使用ngApp.
Angular会检测应用在浏览器是否已启动并且只允许第一次的启动,随后的每次启动都将会导致浏览器控制台报错.
这可以防止应用出现多个Angular实例尝试在Dom上运行的一些奇异结果.
格式:angular.bootstrap(element,[modules]);
element:Dom元素,angular应用启动的根节点
modules:数组,angular应用的依赖模块
使用代码:
<div id="ngApp">
<div ng-controller="testCtrl as ctrl">
{{ctrl.value}}
</div>
</div>

(function () {
angular.module("Demo", [])
.controller("testCtrl", testCtrl);
function testCtrl() {
var vm = this;
vm.value = "Hello World";
}
angular.bootstrap(document.getElementById("ngApp"), ["Demo"]);
}());

一般来说,我们写ng程序,都会在页面Dom元素上写ngApp指令用来启动Angular程序,但是也可能出现一些特殊情况需要我们在启动之前干些什么或者需要我们手动启动应用程序,这时候angular.bootstrap就派的上用场了。
angular.copy
针对对象或数字创建一个深层的拷贝。
格式:angular.copy(source, [destination]);
source:被拷贝的对象
destination:接收的对象 [注意:参数类型是对象或数组]
使用代码:
var objA, objD = []; //objA:undefined objD:[]
var objB = { text: "Hello World" };
var objC = {text:"Hai",value:"Test"};
objA = angular.copy(objB); // objA:{ text:"Hello World"} objB:{ text:"Hello World"}
angular.copy(objC, objD);// objC:{text: "Hai", value: "Test"} objD:[text: "Hai", value: "Test"]
对Angular API 逐个的自己翻译一次,然后写能运行成功的代码,并把学习记录下来...
Angular - - angular.bind、angular.bootstrap、angular.copy的更多相关文章
- html、css/bootStrap、js/Jquery、ajax与json数据交互总结
设计个个人网站,利用CSS.JavaScript.HTML5.jQuery库和AJAX等 实现网站各功能模块,下面介绍我设计的网站各大功能模块: 个人简历模块: 包涵个人基本信息(利用CSS的flo ...
- MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录
注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...
- angular 配置开发环境、测试环境、生产环境
1. 配置开发环境.测试环境.生产环境 (1). environment.ts - 开发环境: 用于程序开发 (创建项目时自动生成) export const environment = { prod ...
- Angular Js 与bootstrap, angular 与 vue.js
今天突然接到电话, 问我他们的区别 虽然平时看了,但是没记住,凉凉是肯定的 总结一下: bootstrap不算是javascript框架,它只是一个前端的ui框架,然后有一些附带的js插件而已.an ...
- Angular 个人深究(一)【Angular中的Typescript 装饰器】
Angular 个人深究[Angular中的Typescript 装饰器] 最近进入一个新的前端项目,为了能够更好地了解Angular框架,想到要研究底层代码. 注:本人前端小白一枚,文章旨在记录自己 ...
- 从Java角度理解Angular之入门篇:npm, yarn, Angular CLI
本系列从Java程序员的角度,带大家理解前端Angular框架. 本文重点介绍Angular的开发.编译工具:npm, yarn, Angular CLI,它们就像Java在中的Maven,同时顺便介 ...
- (转载)从Java角度理解Angular之入门篇:npm, yarn, Angular CLI
本系列从Java程序员的角度,带大家理解前端Angular框架. 本文是入门篇.笔者认为亲自动手写代码做实验,是最有效最扎实的学习途径,而搭建开发环境是学习一门新技术最需要先学会的技能,是入门的前提. ...
- Angular入门,开发环境搭建,使用Angular CLI创建你的第一个Angular项目
前言: 最近一直在使用阿里的NG-ZORRO(Angular组件库)开发公司后端的管理系统,写了一段时间的Angular以后发现对于我们.NET后端开发而言真是非常的友善.因此这篇文章主要是对这段时间 ...
- Angular4.0引入第三方框架,eg: bootstrap、jquery
最近学习angular4.0,在练习是需要使用jquery和bootstrap.但是查阅了,大多数都是angular2的方法,或者是angular4.0的方法但是不准确.花了一些时间终于捣腾出来了,把 ...
- bootstrap、angularJS、nodeJs、reactJs视频教程
bootstrap.angularJS.nodeJs.reactJs视频教程 发布时间:『 2017-06-25 19:50』 博客类别:资源下载 阅读(74) 评论(0) 智能社与达内哪个好?说 ...
随机推荐
- constraint 摘自群主大大
CONSTRAINT 子句 限制和索引相似,虽然限制也能被用于建立和另一个表的关联. 用 ALTER TABLE 和 CREATE TABLE 语句中的 CONSTRAINT 子句来建立或删除条件.C ...
- 未出现的子串(unapeared)
未出现的子串(unapeared) 题目描述 有一个长度为n的数字串,其中会出现数字1,2,3,…,q(5≤q≤9).现在的问题是,需要求出一个长度最小的串(出现的数字也是1-q),使得该串不是这个数 ...
- 读写锁的实现原理(pthread_rwlock_t)
引言 不同的锁之间的语义是不一样的,没有一劳永逸的锁,只有更适合的锁. 如果是同一进程里的不同线程共享读写锁,那么读写锁变量的维护是在进程内部即可.如果是不同进程共享读写锁,那么读写锁变量的维护是在共 ...
- zepto学习之路--源代码提取
最近在看zepto的源代码,把一些有用的函数摘出来,看看zepto是怎么实现的,自己做的时候也可以用.说实话,zepto的实现有一些看起来还是很晦涩的,可能是自己的水平不够,看不透作者的真正的意图. ...
- web 开发:CSS3 常用属性——速查手册!
web 开发:CSS3 常用属性——速查手册! CSS3 简介:http://www.runoob.com/css3/css3-intro.html 1.目录 http://caniuse.com/ ...
- CSS文字垂直居中和font-family属性
1.单行文字的垂直居中 单行文字垂直居中比较简单,直接让行高==盒子高度即可. 2.多行文字居中 多行文字居中,只需简单计算一下盒子的上padding即可.计算公式:padding-top=(盒子的高 ...
- acm--统计错误数
题目描述 题目地址:http://www.nowcoder.com/practice/67df1d7889cf4c529576383c2e647c48?tpId=49&tqId=29276&a ...
- Linux内核源码分析--内核启动之(3)Image内核启动(C语言部分)(Linux-3.0 ARMv7)
http://blog.chinaunix.net/uid-20543672-id-3157283.html Linux内核源码分析--内核启动之(3)Image内核启动(C语言部分)(Linux-3 ...
- Content Provider 小结
Android中的四大组件之一ContentProvider,它支持多个应用间进行存储和读取数据等操作,实现不同应用间的数据共享. ContentProvider,解释为内容提供商.顾名思义,就是对外 ...
- CI框架学习——检查用户名与密码是否合法(二)
检查用户名与密码是否合法 步骤一.编写用户登录的窗体见下面内容 步骤二.编写数据库校验方法 $username = $_POST["username"]; # ...