复制相同的对象

Question

我找到的这个问题的解决方案都没有让我满意。

我有一个创建、删除和复制项目的控制器。每当我复制一个项目时，它们显然具有相同的属性。然而，我希望能够区分和识别它们。此外，重复的项目需要在原始项目之后插入。

我想出了一些非常简单的解决方案：

1. 生成唯一键并将其分配给创建的项目。
2. 有一些 id 计数器，每个必须分配一个 ID 的项目都会增加一个（与解决方案 1 大致相同；可能更快但不必要地污染代码）。
3. 在数组中插入项目并重新渲染，以便它从 Angular 获得 $$hashKey。

我想第一个解决方案将是最佳实践，因为我可以为此创建一个模块。第二种解决方案可能是最快的解决方案，但我不喜欢我需要一个计数器的事实。第三种解决方案似乎根本不是一个好主意，因为这违反了 Angular 的原则。

我不知道它是否有用，但这里有一个fiddle。

HTML

<div ng-app ng-controller="MyCtrl">
    <div ng-repeat="item in items">
        <p>{{item.id}}</p>
        <input type="submit" ng-click="duplicateItem(item)" value="Duplicate"></input>
        <input type="submit" ng-click="removeItem(item)" value="Remove"></input>
    </div>
</div>

JavaScript：

var myApp = angular.module('myApp', []);

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {
    $scope.items = [
        {
            type: 'text',
            id: 'ID_1' },
        {
            type: 'text',
            id: 'ID_2' }
    ];

    $scope.duplicateItem = function(item) {
        $scope.items.push(item);
    };

    $scope.removeItem = function(item) {
        // Removes item
    };   
}

Answer 1

使用angular.copy。这将执行一个深度复制，它将被 Angular 识别为不同的对象。

当您在本机 javascript 中复制整个对象时，问题在于您还复制了 angular 模型所基于的内部 id视图映射。

这是您的 jsFiddle 的更新版本，您可以在其中看到它的实际效果。