angular copy深度拷贝

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

程序媛-静儿

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

阅读量1.1k

点赞数

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

angular copy 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

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

angular的操作实质是对dom的model进行操作，几乎所有的渲染都应放在model层。

<html ng-app="myApp">  
<head>  
    <meta charset='utf-8'>  
    <script src="./angular.min.js"></script>    
</head>  
<div ng-controller="Controller">  
  <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>  
var app = angular.module('myApp', []);  
app.controller('Controller', ['$scope', function($scope) {  
    $scope.master= {};  
   
    $scope.update = function(user) {  
      // Example with 1 argument  
      $scope.master= angular.copy(user);  
    };  
   
    $scope.reset = function() {  
      // Example with 2 arguments  
      angular.copy({}, $scope.user);//重置数据的层面放在此处，此处将一个空对象{}深拷贝到user中，可以根据需求放入原来的模型。  
    };  
   
    $scope.reset();  
}]);  
</script>  
</html>