angular提供了一个可以复制对象的api——copy(source,destination),它会对source对象执行深拷贝。

使用时需要注意下面几点:

  • 如果只有一个参数(没有指定拷贝的对象),则返回一个拷贝对象
  • 如果指定了destination,则会深拷贝对象复制给destination
  • 如果source是null或者undefined,那么会直接返回source
  • 如果source就是desitination,那么会报错。

下面看看使用样例:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
</head>
<body ng-app="copyExample">
<div ng-controller="ExampleController">
<form novalidate class="simple-form">
Name: <input type="text" ng-model="user.name" /><br />
E-mail: <input type="email" ng-model="user.email" /><br />
Gender:
<input type="radio" ng-model="user.gender" value="male" />
male
<input type="radio" ng-model="user.gender" value="female" />
female
<br />
<button ng-click="reset()">RESET</button>
<button ng-click="update(user)">SAVE</button>
</form>
<pre>form = {{user | json}}</pre>
<pre>master = {{master | json}}</pre>
</div> <script>
angular.module('copyExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.master= {}; var test1;
console.log(angular.copy(test1));//undefined
var test3=null;
console.log(angular.copy(test2));//undefined var test2 = "a";
// console.log(angular.copy(test2,test2));//error!! $scope.update = function(user) {
// Example with 1 argument
$scope.master= angular.copy(user);
}; $scope.reset = function() {
// Example with 2 arguments
angular.copy($scope.master, $scope.user);
console.log($scope.master);
console.log($scope.user);
}; $scope.reset();
}]);
</script>
</body>
</html>

AngularJS API之copy深拷贝的更多相关文章

  1. JS Object Deep Copy & 深拷贝 & 浅拷贝

    JS Object Deep Copy & 深拷贝 & 浅拷贝 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Refe ...

  2. 搭建angularjs API文档站点

    提供一个国内可以访问的 angularjs API文档站点 http://i.frllk.com/ 文档直接在 github 上下载的: https://github.com/angular-cn/n ...

  3. 【16】AngularJS API

    AngularJS API API 意为 Application Programming Interface(应用程序编程接口). AngularJS 全局 API AngularJS 全局 API ...

  4. JS Object Deep Copy & 深拷贝

    JS Object Deep Copy & 深拷贝 针对深度拷贝,需要使用其他方法 JSON.parse(JSON.stringify(obj));,因为 Object.assign() 拷贝 ...

  5. AngularJS API

    AngularJS 全局 API 用于执行常见任务的 JavaScript 函数集合 angular.lowercase() 转换字符串为小写 angular.uppercase() 转换字符串为大写 ...

  6. AngularJS API之$injector ---- 依赖注入

    在AngularJS中也有依赖注入的概念,像spring中的依赖注入,但是又有所不同.Spring中使用构造注入或者设值注入的方式,还需要做一些额外的操作,但是angular中只需要在需要的地方声明一 ...

  7. AngularJS API之bootstrap启动

    对于一般的使用者来说,AngularJS的ng-app都是手动绑定到某个dom元素.但是在一些应用中,这样就显得很不方便了. 绑定初始化 通过绑定来进行angular的初始化,会把js代码侵入到htm ...

  8. AngularJS API之extend扩展对象

    angular.extend(dst,src),在我实验的1.2.16版本上是支持深拷贝的.但是最新的API显示,这个方法是不支持深拷贝的. 另外,第二个参数src支持多个对象. 第一种使用方式 va ...

  9. [CareerCup] 13.4 Depp Copy and Shallow Copy 深拷贝和浅拷贝

    13.4 What is the difference between deep copy and shallow copy? Explain how you would use each. 这道题问 ...

随机推荐

  1. Android程序设计-RecyclerView的使用

    [定义] 看到这个标题,也许你会问什么是RecyclerView?其实开始的时候我也不知道- -,下面小编将带领大家领略RecyclerView的强大之处 [描述] 看完这个我想大家应该知道了吧,这个 ...

  2. MySql的一些操作

    我们安装mysql时一开始root用户如果没设置的话是可以没有密码的,所以,如果需要设置密码,则 格式:mysql> set password for 用户名@localhost = passw ...

  3. AngularJs ngInclude、ngTransclude

    这两个都是HTML DOM嵌入指令 ngInclude 读取,编译和插入外部的HTML片段. 格式:ng-include=“value”<ng-include src=”value” onloa ...

  4. 生活中的MVC模式,一个吃货的理解。

    以下是生活中对于MVC模式的领悟,虽然可笑,轻喷. 2015年 8月 26日 M  => Model       模型 我认为叫做模具更好的理解.批量加工生产具有相同特征的东西.        ...

  5. gnuplot使用2

    设置图中连线的颜色.宽度.连线样式等 set style line 每个显示终端都有默认的线类型和点类型集合,可以通过在命令行输入: test查看,如下图显示了在wxt终端模式下默认的线的集合和点的集 ...

  6. CSS3定位和浮动详解

    本文为大家分享CSS3定位和浮动的基础概念,与使用方法,供大家参考,具体内容如下 一.定位 1. css定位: 改变元素在页面上的位置 2. css定位机制: 普通流: 浮动: 绝对布局: 3. cs ...

  7. 开发板ping不通主机和虚拟机的看过来(转载)!

    前几天在做uboot下用tftp下载文件到开发板的实验时,为了能解决开发板ping不通主机和虚拟机的问题,可谓绞尽脑汁,正所谓久病成医,虽然为了这一小问题废了我那么长时间,但我在解决问题的同时也学到了 ...

  8. jpa datasource config

    application.properties spring.datasource.driverClassName= spring.datasource.url= spring.datasource.u ...

  9. Android学习笔记——Button

    该工程的功能是实现在activity中显示一个TextView和一个Button 以下代码是MainActivity中的代码 package com.example.button; import an ...

  10. NGINX 配置404错误页面转向

    什么是404页面 如果碰巧网站出了问题,或者用户试图访问一个并不存在的页面时,此时服务器会返回代码为404的错误信息,此时对应页面就是404页面.404页面的默认内容和具体的服务器有关.如果后台用的是 ...