AngularJS方法 —— angular.copy

描述:

  复制一个对象或者一个数组(好吧,万物皆对象,数组也是一个对象)。

  如果省略了destination,一个新的对象或数组将会被创建出来;

  如果提供了destination,则source对象中的所有元素和属性都会被复制到destination中;

  如果source不是对象或数组(例如是null或undefined), 则返回source;

  如果source和destination类型不一致,则会抛出异常。

  注意:这个是单纯复制覆盖,不是类似继承

使用方法:

  angular.copy(source, [destination]);

参数:

参数名称 参数类型 描述
source * 被copy的对象. 可以使任意类型, 包括null和undefined.
destination (optional) Object||array copy去的目的地. 可以省略, 如果不省略, 其必须和source是同类

返回值:

  返回复制或更新后的对象。

实例:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title></title>
        <script src="js/angular.min.js"></script>
        <script type="text/javascript">
            angular.module(‘copyExample‘, []).controller(‘ExampleController‘, [‘$scope‘, function ($scope) {
            $scope.master = {};
            $scope.update = function (user) {
                //将user复制后,赋值给master;
                    $scope.master = angular.copy(user);
            };
            
            $scope.reset = function () {
                // 将复制后的$scope.master,赋值给$scope.user,因为$scope.master = {},所以点击RESET,会清空邮箱内容
                angular.copy($scope.master, $scope.user);
            };
            $scope.reset();
            }]);
        </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" />(输入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>
</body>
</html>

点击sava按钮之前效果:

点击sava按钮之后的效果:

点击reset之后的效果:

时间: 2024-10-11 04:28:19

AngularJS方法 —— angular.copy的相关文章

angularJs方法

angularJs的工具方法 1.angular.iaArray() 返回true; 2. angular.iaElement() 支持判断JQ获取到的对象 3.angular.equals(a,b) 判断两个参数是否相等: var a=2; var b=2; console.log(angular.equals(a,b));//true var c=[]; var d=[]; console.log(angular.equals(c,d));//true var c=[1,2]; var d=

angular.copy和angular.extend

angular.copy用于深复制,而angular.extend用于拓展.     angular.copy(src,[dst]) src:源对象 dst:目标对象,复制的对象 js中 '= '操作符复制的是指针,所以前后两个变量指向的还是内存中的同一个对象,所以在其中一个变量上操作该对象时,对另外一个变量也会生效.而angular.copy方法是深复制,会在内存中再生成一个对象,两个变量彼此独立,互不影响. 接收一个必须参数src,一个可选参数dst.如果dst没有提供,就会创建对象或者数组

嘿!@野兽,你的ng api 掉了 - - angular.copy

@野兽的 ng api 学习 -- angular.copy angular.copy 针对对象或数字创建一个深层的拷贝. 格式:angular.copy(source, [destination]); source:被拷贝的对象 destination:接收的对象 [注意:参数类型是对象或数组] 使用代码: var objA, objD = []; //objA:undefined objD:[] var objB = { text: "Hello World" }; var obj

angular.copy()

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>angular.copy</title> </head> <body ng-app="copyExample"> <h1>angular.copy</h1> <p> <span>描述:</span&g

angular.js 的angular.copy 、 angular.extend 、 angular.merge

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script src="js/angular.min.js" type="text/javascript" charset="utf-8"></s

AngularJS API之copy深拷贝

    阅读目录 使用时需要注意下面几点: 下面看看使用样例: angular提供了一个可以复制对象的api——copy(source,destination),它会对source对象执行深拷贝. 回到顶部 使用时需要注意下面几点: 如果只有一个参数(没有指定拷贝的对象),则返回一个拷贝对象 如果指定了destination,则会深拷贝对象复制给destination 如果source是null或者undefined,那么会直接返回source 如果source就是desitination,那么

angular.extend vs angular.copy

1.angular.copy angular.copy(source, [destination]);  // source: copy的对象. 可以使任意类型, 包括null和undefined.    destination:接收的对象   返回复制或更新后的对象 如果省略了destination,一个新的对象或数组将会被创建出来: 如果提供了destination,则source对象中的所有元素和属性都会被复制到destination中: 如果source不是对象或数组(例如是null或u

angularJSapi学习-angular.copy使用

angular.copy使用 效果: 初始状态: 输入信息后未保存状态: 点击save后状态: 当输入框内容和master内容不一致时: 点击reset使得user的信息被重置为master中信息: 具体代码: 1 <!DOCTYPE HTML> 2 <html ng-app="app"> 3 <head><script src="./angular.min.js"></script></head&g

走进AngularJs(一)angular基本概念的认识与实战

一.前言 前端技术的发展是如此之快,各种优秀技术.优秀框架的出现简直让人目不暇接,作为一名业界新秀,紧跟时代潮流,学习掌握新知识自然是不敢怠慢.当听到AngularJs这个名字并知道是google在维护它时,便一直在关注,看到其在国外已经十分火热,可是国内的使用情况却有不小的差距,参考文献/网络文章也很匮乏.朝思暮想良久,决定深入学习angular,并写系列博客,一方面作为自己学习路程上的记录,另一方面也给有兴趣的同学一些参考. 首先我自己是一名学习者,会以学习者的角度来整理我的行文思路,故该系