angular.copy() 深拷贝

最新推荐文章于 2023-04-04 14:31:24 发布

爱吃菠萝蜜的小透明

最新推荐文章于 2023-04-04 14:31:24 发布

阅读量2.1w

点赞数 4

CC 4.0 BY-SA版权

分类专栏： angualr 文章标签： angular copy

本文链接：https://blog.youkuaiyun.com/qq_36821520/article/details/70314270

angualr 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了AngularJS中angular.copy()函数的使用方法及其注意事项，包括如何复制对象和数组，并通过示例展示了如何在实际项目中应用此函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

因为项目中需要拷贝，查阅angularjs API文档，发现对angular.copy() 的解释：

复制一个对象或者一个数组（好吧，万物皆对象，数组也是一个对象）。
1> 如果省略了destination，一个新的对象或数组将会被创建出来；
2> 如果提供了destination，则source对象中的所有元素和属性都会被复制到destination中；
3> 如果source不是对象或数组（例如是null或undefined）, 则返回source；
4> 如果source和destination类型不一致，则会抛出异常。注意：这个是单纯复制覆盖，不是类似继承。

使用方法：

angular.copy(source, [destination]);

参数：

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

返回值：

返回复制或更新后的对象

<!DOCTYPE html>
<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="copyApp">
        <div ng-controller="CopyController">
            <form novalidate class="simple-form">
                姓名: <input type="text" ng-model="user.name" /><br /> 
                年龄：<input type="number" ng-model="user.age" /><br /> 
                邮箱: <input type="email" ng-model="user.email" /><br />
                性别：<input type="radio" ng-model="user.gender" value="male" /> 男
                <input type="radio" ng-model="user.gender" value="female" /> 女
                <br />
                <button ng-click="reset()">重置</button>
                <button ng-click="update(user)">保存（拷贝）</button>
            </form>
            <pre>form = {{user | json}}</pre>
            <pre>master = {{master | json}}</pre>
        </div>

        <script>
            angular.module('copyApp', [])
                .controller('CopyController', ['$scope', function($scope) {
                    $scope.master = {};
                    $scope.update = function(user) {
                        $scope.master = angular.copy(user);
                        console.log($scope.master);
                    };
                    $scope.reset = function() {
                        angular.copy($scope.user, $scope.master);
                        console.log($scope.master);// Object {  }
                        console.log($scope.user);  //undefined
                    };
                    $scope.reset();
                }]);
        </script>
    </body>

</html>

效果图

—-效果图——