AngularJS 更新 CRUD table 时避免重复（正常添加到 table 有效）

Question

我正在尝试创建一个不允许重复名称的简单 CRUD table。在向 table 添加联系人时，我已经能够使副本正常工作，但在更新 table.

时它似乎不起作用

下面是我验证联系人唯一性的简单函数：

// (allowed) dupCount is 0 when adding, and 1 when in update
// mode to allow saving the contact without making any changed.
var isUnqiue = function(newContact, dupCount) {
    var returnVal = true;
    var count = 0;

    for (var contact in $scope.model.contacts) {
        if (newContact.name.toUpperCase() === $scope.model.contacts[contact].name.toUpperCase()) {
          count++;
        }
    }

    if (count > dupCount) {
        returnVal = false;
    }

    return returnVal;
}

出于某种原因，更新模式下的副本根本不起作用！即使我将 3 或 4 个联系人更新为相同的名称，'if (count > dupCount) ... ' 语句似乎总是比较 1 和 1。

这是包含完整代码的 JSFiddle：https://jsfiddle.net/7ay9nsLv/

简单场景：

Add 'Adam, Smith'
1. Edit 'Adam, Smith', Save without Changing > Good
2. Add 'Adam, Smith' again > Duplicate Error
Add 'Adam, SmithX'
3. Edit 'Adam, SmithX' to 'Adam, Smith' > Duplicate Error

另请注意，table 中的数据可以排序，所以不确定将 $index 传递给控制器是否有用（除非排序不会更改数据索引）。

Answer 1

首先你在你的 for-loop 中做一些 redudant，你可以简单地使用 Array.prototype.forEach() 方法来查找索引是否存在：

// Use named function to stop looping correctly
var indexExists = -1;
$scope.model.contacts.forEach(function loop(contact, index) {
  if (loop.stop) {
    return;
  }
  if (contact.name.toUpperCase() === newContact.name.toUpperCase()) {
    indexExists = index;
    loop.stop = true;
  }
});

或使用 ES6:

var indexExists = $scope.model.contacts.findIndex(function(contact) {
  return contact.name.toUpperCase() === newContact.name.toUpperCase();       
});

甚至使用 underscorejs:

的 findIndex 方法

_.findIndex($scope.model.contacts, function(contact) { return contact.name.toUpperCase() === newName });

然后简单地检查一下：

return indexExists == -1 && indexExists !== idx || indexExists === idx && $scope.model.contacts[indexExists].name.toUpperCase() === newName;

仅当用户不存在或存在且正在编辑自身时，它才会 returns 为真。

现在，让我们转到错误：

您犯了 2 个错误:

您正在将 old 联系人传递给 unique 函数，您应该传递 new 联系人。

改变

这个:

if (isUnqiue(contact, 1)) {

为：

if (isUnqiue($scope.model.selected, 1)) {

您将 $scope.error 归于旧联系人，应该是这样的：

$scope.errorContact = $scope.model.selected;

DEMO

Answer 2

你应该不是在客户端，而是在服务器上捕获重复错误））在 UserName 字段上创建 Uniq 约束（如果不存在则创建主键）。因此，当您尝试 put 或 post duplicate 时，db 会抛出错误。您可以捕获它并在某些错误页面上重定向，或者向响应添加一些错误信息，或者只显示后端错误。

AngularJS 更新 CRUD table 时避免重复（正常添加到 table 有效）

AngularJS Avoid duplicates when updating a CRUD table (normal add to table works)

javascript

crud

angularjs