天天看點

日常總結 之 angular copy 深拷貝

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>
           
NG

繼續閱讀