AngularJS API之copy深拷贝详解及实例


Posted in Javascript onSeptember 14, 2016

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

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

  1. 如果只有一个参数(没有指定拷贝的对象),则返回一个拷贝对象
  2. 如果指定了destination,则会深拷贝对象复制给destination
  3. 如果source是null或者undefined,那么会直接返回source
  4. 如果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深拷贝详解及实例

以上就是对AngularJS API之copy深拷贝的资料整理,后续继续补充相关资料,谢谢大家对本站的支持!

Javascript 相关文章推荐
javascript 鼠标滚轮事件
Apr 09 Javascript
Javascript实现页面跳转的几种方式分享
Oct 26 Javascript
js改变鼠标的形状和样式的方法
Mar 31 Javascript
javascript 实现 原路返回
Jan 21 Javascript
Jquery中的$.each获取各种返回类型数据的使用方法
May 03 Javascript
JavaScript中的Math.LN2属性用法详解
Jun 12 Javascript
react-router4 嵌套路由的使用方法
Jul 24 Javascript
JS实现同一DOM元素上onClick事件与onDblClick事件并存的解决方法
Jun 07 Javascript
vue1.0和vue2.0的watch监听事件写法详解
Sep 11 Javascript
使用 Node.js 实现图片的动态裁切及算法实例代码详解
Sep 29 Javascript
vue+elementUI组件table实现前端分页功能
Nov 15 Javascript
解决pycharm双击但是无法打开的情况
Oct 31 Javascript
AngularJS $injector 依赖注入详解
Sep 14 #Javascript
详解XMLHttpRequest(二)响应属性、二进制数据、监测上传下载进度
Sep 14 #Javascript
详解XMLHttpRequest(一)同步请求和异步请求
Sep 14 #Javascript
AngularJs ng-route路由详解及实例代码
Sep 14 #Javascript
js实现文字截断功能
Sep 14 #Javascript
jQuery版AJAX简易封装代码
Sep 14 #Javascript
原生JS实现首页进度加载动画
Sep 14 #Javascript
You might like
关于php curl获取301或302转向的网址问题的解决方法
2011/06/02 PHP
php使用CURL伪造IP和来源实例详解
2015/01/15 PHP
看了就知道什么是JSON
2007/12/09 Javascript
不要在cookie中使用特殊字符的原因分析
2010/07/13 Javascript
基于jquery实现的鼠标滑过按钮改变背景图片
2011/07/15 Javascript
解析prototype,JQuery中跳出each循环的方法
2013/12/12 Javascript
js跳转页面方法总结
2014/01/29 Javascript
在Google 地图上实现做的标记相连接
2015/01/05 Javascript
js在指定位置增加节点函数insertBefore()用法实例
2015/01/12 Javascript
angularJS 入门基础
2015/02/09 Javascript
javascript事件委托的方式绑定详解
2015/06/10 Javascript
Javascript编写2048小游戏
2015/07/07 Javascript
jQuery获取attr()与prop()属性值的方法及区别介绍
2016/07/06 Javascript
概述VUE2.0不可忽视的很多变化
2016/09/25 Javascript
基于jquery的on和click的区别详解
2018/01/15 jQuery
vue.js在标签属性中插入变量参数的方法
2018/03/06 Javascript
微信小程序实现获取准确的腾讯定位地址功能示例
2019/03/27 Javascript
vue项目出现页面空白的解决方案
2019/10/31 Javascript
js实现微信聊天效果
2020/08/09 Javascript
[01:10]DOTA2亚洲邀请赛 征战号角响彻全场
2015/01/06 DOTA
[52:41]OG vs IG 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/20 DOTA
合并Excel工作薄中成绩表的VBA代码,非常适合教育一线的朋友
2009/04/09 Python
钉钉群自定义机器人消息Python封装的实例
2019/02/20 Python
python实现简单聊天室功能 可以私聊
2019/07/12 Python
pycharm激活码有效到2020年11月底
2020/09/18 Python
Python logging模块handlers用法详解
2020/08/14 Python
使用py-spy解决scrapy卡死的问题方法
2020/09/29 Python
python 实时调取摄像头的示例代码
2020/11/25 Python
CSS中几个与换行有关的属性简明总结
2014/04/15 HTML / CSS
使用数据结构给女朋友写个Html5走迷宫游戏
2019/11/26 HTML / CSS
餐饮总经理岗位职责
2014/03/07 职场文书
搞笑爱情保证书
2014/04/29 职场文书
四风查摆剖析材料
2014/10/10 职场文书
公司更名通知函
2015/04/24 职场文书
单位综合评价意见
2015/06/05 职场文书
MySQL之高可用集群部署及故障切换实现
2021/04/22 MySQL