将克隆的元素添加到ng-repeat

时间:2018-06-27 11:43:29

标签: javascript angularjs angularjs-ng-repeat

我知道,为了能够在ng-repeat中添加“重复项”,您可以使用track by,但这在我的情况下不起作用

我有以下ng-repeat指令:

<div class="well" ng-repeat="surveyData in surveyDatas track by $index">

我的用户可能想向该列表中添加一个新的SurveyData,它们之间的差异可能只是50个字段中的一个,因此克隆它是理想的解决方案,因此我尝试这样处理:< / p>

DOM:

<button class="btn-sm btn-danger margin10" ng-click="cloneSurveyData(surveyData)">Clone Survey Data:</button>

控制器:

$scope.cloneSurveyData = function (surveyData){
     surveyData.id = null;
     $scope.surveyDatas.push(surveyData);
};

但是,我当然知道:

Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: surveyData in surveyDatas | orderBy:'id', Duplicate key: object:150

我尝试通过id进行跟踪,并在控制器中创建一个变量,然后将其等于SurveyData,什么都没有

我唯一的选择是创建一个新变量并使所有字段均等吗?

1 个答案:

答案 0 :(得分:3)

尝试将带有angular.copy的surveyData复制到tmp变量,然后将其推送到数组:

$scope.cloneSurveyData = function (surveyData){
    var temp = angular.copy(surveyData);
    temp.id = null;
    $scope.surveyDatas.push(temp);
};

编辑:

作为解释,我希望这会有所帮助:

您的示例代码中没有order by,但您在错误文本中输入了它:

  

中继器:surveyDatas中的surveyData | orderBy:'id',重复键:object:150

使用您的代码,您仅创建了一个引用并将其推入数组。因此orderBy试图对两个对象ID完全相同的对象进行排序。