使用Angular將對象屬性（不含值）複製到另一個對象

我們嘗試過angular.copy和angular.extend。但是，這兩個都複製屬性值。我們如何將一個對象的屬性（不帶它們的值）複製到另一個對象？使用Angular將對象屬性（不含值）複製到另一個對象

這是fiddle，我們的嘗試基於how-to-quickly-clear-a-javascript-object。

angular.module('App', []); 

function Ctrl($scope) { 

    function copyNotValues(obj) { 
     var newObj = angular.copy(obj); 
     for (prop in newObj) { 
      if(newObj.hasOwnProperty(prop)) 
      { 
       newObj[prop] = null; 
      } 
     }; 
     return newObj; 
    } 

    $scope.master = { 
     foo: 'original foo', 
     bar: 'original bar' 
    }; 

    $scope.copy = angular.copy($scope.master); 
    $scope.extend = angular.extend($scope.master); 
    $scope.copyNotValues = copyNotValues($scope.master); 

}

來源

2014-02-13 Shaun Luttin

JavaScript沒有類的概念。它使用Prototype繼承，這意味着您只能通過複製另一個對象來創建新對象。當你這樣做時，你會得到屬性。

你可以通過創建一個沒有屬性值的「主」對象來解決這個問題。事情是這樣的：

master = { 
    foo: '', 
    bar: '' 
};

然後你就可以創建新的對象「實例」使用new關鍵字：

$scope.master = new master(); 
$scope.master.foo = 'original foo'; 
$scope.master.bar = 'original bar';

當你需要創建對象的新實例，回去原來，不是你的副本：

$scope.masterCopy = new master();

這的確是一個JavaScript的問題，而不是一個角具體問題。我想你理論上可以編寫一個函數來創建一個對象的新實例，然後遍歷這些屬性將它們全部設置爲空或空字符串。

來源

2014-02-13 00:42:45 JeffryHouser

感謝您的！我的方法是使用angular.copy（），遍歷新對象，並將其每個屬性設置爲null。創建一個「主」對象可能對另一種情況有好處，因爲我的興趣對象來自REST調用並具有許多屬性，所以創建主對象會導致大量代碼重複。 –

@ShaunLuttin在我的ActionScript體驗中，在服務器端和客戶端複製對象是非常有意義的。但是由於JavaScript是一種鬆散類型的語言，因此開銷可能沒有意義。我很確定每個循環都會給你一個對象的所有屬性;你應該能夠將其封裝到一個實用函數中，以便於重用。祝你好運！ – JeffryHouser

偉大的提示！我們已經複製了服務器端和客戶端上的對象。在服務器上，我們有一個綁定模型和一個視圖模型。在客戶端，我們有HTML模板中存在的ng模型。如果我們也要在ng控制器中複製模型，那麼我們將有相同模型的四個表示形式！就像你提到的，三個似乎有足夠的開銷。 JavaScript for循環在我們投入到Angular服務中的效用函數中做了訣竅。謝謝你的鼓勵！ –

我的解決方案如下您可以使用angular.copy並傳遞對象。在此之前用空白大括號定義對象。代碼如下。我使用了其他一些示例，但下劃線方法相同。

angular.module('formExample', []) 
 
    .controller('ExampleController', ['$scope', function($scope) { 
 

 
    $scope.sa = {}; //declaring sa object 
 
    $scope.ba = {}; //declaring ba object 
 
    $scope.update = function() { 
 
     $scope.ba = angular.copy($scope.sa); 
 
    }; 
 

 
    }]);

<!doctype html> 
 
<html lang="en"> 
 

 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Example - example-example32-production</title> 
 

 

 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-beta.2/angular.min.js"></script> 
 

 

 

 
</head> 
 

 
<body ng-app="formExample"> 
 
    <div ng-controller="ExampleController"> 
 
    <form novalidate class="simple-form"> 
 
     <h3>Shipping Address</h3> 
 
     Name:<input type="text" ng-model="sa.name" ng-change="sameAddress && update()" placeholder="in" /><br/> Age: 
 
     <input type="text" ng-model="sa.age" ng-change="sameAddress && update()" placeholder="age" /> 
 
     <br /> Street: 
 

 
     <br /> 
 

 
     <h3>Billing Address 
 
     <input type="checkbox" ng-model="sameAddress" ng-change="sameAddress && update()" />Copy 
 
     </h3> 
 

 
     Name:<input type="text" ng-model="ba.name" ng-disabled="sameAddress" placeholder="out" /><br/> Age: 
 
     <input type="text" ng-model="ba.age" ng-disabled="sameAddress" placeholder="age" /> 
 
     <br /> 
 

 
     <br /> 
 

 
    </form> 
 

 
    </div> 
 

 

 
</body> 
 

 
</html>

的pluner是here

來源

2017-03-02 17:16:35

使用Angular將對象屬性（不含值）複製到另一個對象

回答

相關問題