javascript - AngularJS复制现有表行

我有一个带有编辑和删除按钮的表。但是现在我也想制作一个克隆按钮。

克隆按钮应按以下方式工作：从用户单击的行中克隆几乎所有数据（例如他无法获取的ID之类的数据）。然后转到编辑页面，并在其中将数据填充到输入/选择值中。

但是我不知道如何完成这项工作。
我现在有一个输出所有数据的函数：var cloneJob = angular.extend(job);

然后转到编辑页面location.href = '#/jobs/add';
但是问题是他没有填写输入/选择值。
AngularJS是否有为此功能？我是在正确的轨道上还是我需要做其他事情？

更新
这是一点点代码：

这是我表的代码：

<tr ng-repeat="job in (filtered.rows = (jobs | orderBy: orderByDate:true | filter:filterByActive | filter:filter.query)) | skip:pagination.pageSkip() |limitTo:pagination.perPage" ng-class="{ inactive : !job.active }"  style="cursor: pointer;">
    <td>
        <span ng-bind="job.title"></span>
    </td>
    <td>
        <span ng-bind="job.client.name"></span>
    </td>
    <td>
        <span ng-bind="job.referenceNumber"><span>
    </td>
    <td>
        <span ng-bind="job.creationDate"><span>
    </td>
    <td>
        <a ng-href="#/jobs/edit/{{job.id}}/tab/candidates" ng-bind="job.candidates.length"></a>
    </td>
    <td>
        <span class="status" ng-class="job.status.value"></span>
    </td>
    <td>
        <a ng-if="job.active" ng-href="#/jobs/edit/{{job.id}}" class="icon go">
            <span class="tooltip" translate="job_name_details"></span>
        </a>
        <a ng-if="job.active" class="icon close" ng-click="showClosePopup(job)">
            <span class="tooltip" translate="job_close"></span>
        </a>

        <a ng-click="cloneJob(job)" ><span>Clone!</span></a>
        <!-- <button data-ng-click="cloneItem(food)" class="btn inline">Add</button> -->

    </td>
</tr>

函数cloneJob是：

$scope.cloneJob = function (job){
    var cloneJob = angular.extend(job);
    location.href = '#/jobs/add';
}

这会输出很多json（所有正确的数据），并转到添加页面。

最佳答案

尝试类似

<tr ng-repeat="whatever in whatevers"><button ng-click="duplicateItem(whatever)">duplicate</button></tr>

并在控制器上：

$scope.duplicateItem = function(item){
   $scope.duplicatedItem = angular.copy(item); //this will do a copy, not just assign a reference.
   //if you need clean the duplicate item
   delete $scope.somePropertyYouWannaClean;
}

如果您提供一个有效的示例小提琴或至少提供更多代码，则更好，因此我们可以为您提供更准确的答案。

编辑：

一种更干净的方法是使clone函数将信息加载到服务（或工厂，单例）中。然后，在加载路线后，您可以使用该服务取回内容并进行播放。

喜欢：

angular.module('some.namespace.factory', [])
    .factory('CloneJobFactory', function () {
        return {
            job: null,
            loadJob: function (job) {
                var auxJob = angular.copy(job);//if you just need a shallow copy use angular.extend
                this.job =  this.cleanJob(auxJob);
            },
            getClonedJob: function(){
                return this.job;
            },
            cleanJob: function(job) {
                //code that cleans a job object that has been cloned
                delete job.propertyYouDoNotWantToKeep;

                return job;//return the cleaned job
            }
        };
    });

然后，将在控制器中的clone函数（现在必须注入我们刚刚制造的工厂）只需要包装loadJob方法：

$scope.cloneJob = function (job) {
    CloneJobFactory.loadJob(job);
}

使用克隆数据的功能相同：

$scope.someFunction = function (whateverParams) {
  var clonedJob = CloneJobFactory.getClonedJob();
  //whatever you want
}

这仍然可以改善。

注意：角单例用于在控制器，服务等之间共享信息。

关于javascript - AngularJS复制现有表行，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36446553/

angularjs

javascript - AngularJS复制现有表行