Ошибка дублирования строк в AngularJS

0

Когда я хочу добавить одну и ту же информацию, мне будет согревать ошибку в строке дубликатов.

Эта проблема возникает из $ scope.showSal и ng-repeat = "rows in showSal".

Если я использую ng-repeat = "rows в showSal track по $ index", я не могу добавить повторяющиеся строки, и мне это нужно.

Как я могу заставить анализировать и добавлять дубликаты? Я попытался сделать данные JSON, но я ошибаюсь, даже использую метод stringify и parse... возможно, я не слишком хорошо реализовал разбор...

PS: Мне нужно разобрать массив объектов.

HTML файл:

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Research project</title>
        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
        <script src="js/app/research.js"></script>
    </head>
    <body ng-app="testApp" ng-controller="mainCtrl">
        <table>
            <thead>
                <tr>
                    <th>Nr.</th>
                    <th>An</th>
                    <th>Den</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="rows in showSal">
                    <td>{{rows.id}}</td>
                    <td>{{rows.an}}</td>
                    <td>{{rows.den}}</td>
                </tr>
            </tbody>
        </table>

        <form id="add-content" ng-controller="addInfoCtrl" ng-submit="addInfoDb()">
                <br/>
                <div class="controls">
                        <button type="submit" style="width: 220px;">Adauga salariu</button>
                </div>
        </form>
    </body>
</html>

Файл JavaScript:

var app = angular.module("testApp", []);

app.controller('mainCtrl', ['$scope', '$sce', '$document', function($scope, $sce, $document) {  
    $scope.showSal = [
        { id: '1', an: '2016', den: 'Oracle' },
        { id: '2', an: '2016', den: 'Oracle' }
    ];
}]);

app.controller('addInfoCtrl', ['$scope', function($scope) { 
    $scope.testAdd = { id: '100', an: '2016', den: 'Oracle' }

    $scope.addInfoDb = function() {
        $scope.showSal.push($scope.testAdd);
        console.log($scope.showSal.length);
    }
}]);
  • 0
    Вы должны использовать track by $index а в вашей функции add вам нужно создать дублированный объект, например, angular.copy( objToCopy )
  • 0
    отлично работает с помощью track by $index jsbin.com/vufidedoti/edit?html,js,output

2 ответа

1
Лучший ответ

Ошибка: ngRepeat: dupes Duplicate Key in Repeater

Добавить track by $index

ng-repeat="rows in showSal track by $index"

доктор

  • 0
    Проект больше того, что я разместил здесь, и с 'track by $ index' он не работал ... Я не знаю почему ... но с решением @Yuva Raj это работает очень хорошо.
  • 0
    @ Доро Это действительно лучший ответ, чем тот, который вы выбрали. Функция angular.copy() делает глубокую копию того, что вы передаете, что дорого с точки зрения затрат памяти и времени. track by $index просто указывает альтернативный различитель во время итерации ng-repeat и добавляет некоторую дополнительную доступность бесплатно. Если track by $index у вас не работает, вы, вероятно, испортили использование и должны исправить это, а не идти по значительно менее эффективному маршруту.
Показать ещё 1 комментарий
0

Заменить,

    $scope.showSal.push($scope.testAdd);

чтобы,

    $scope.showSal.push(angular.copy($scope.testAdd));

Здесь работает FIDDLE

  • 0
    Спасибо, это работает очень хорошо.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню