在Angular中克隆具有唯一名称的对象答案

【问题标题】：clone object with unique name in Angular在Angular中克隆具有唯一名称的对象
【发布时间】：2016-04-14 15:35:12
【问题描述】：

我是 Angular 的新手，正在寻找一种在列表中创建克隆按钮的方法。

当我点击这个按钮时，它将克隆对象并在对象名称中添加一个数字：

“新测试” - 将更改为“新测试（2）”等等......

要求每次检查最后3个字母，每次检查所有对象。

有没有图书馆这样做？

【问题讨论】：

你能在这里提供示例代码吗？

标签： html angularjs list

【解决方案1】：

我认为您不需要任何库。基本上，您需要一个循环来查找重复项。看一个例子：

angular.module('myApp', [])
.controller('MyCtrl', function($scope){
  $scope.items = ['Sample item'];
  $scope.suggestedNewName = 'Sample item';
  var isNameOccupied = function(name) {
    return $scope.items.indexOf(name) >= 0;
  };
  $scope.addNewItem = function(){
    var suggestedName = $scope.suggestedNewName;
    var newName = suggestedName;
    for (var i = 2; isNameOccupied(newName); i++) {
      newName = suggestedName + " (" + i + ")";  
    }
    $scope.items.push(newName);
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <form ng-controller="MyCtrl" ng-submit="addNewItem()">
    <ul>
      <li ng-repeat="item in items">{{ item }}</li>
    </ul>
    <label>Suggested name for new item:</label>
    <input type="text" ng-model="suggestedNewName">
    <button type="submit">Add new item!</button>
  </form>
</div>

【讨论】：