angular.js:13920 Alert: [ngRepeat:dupes] Multiple occurrences in a repeater

I encountered an issue while attempting to parse a JSON file and map it in HTML.

Here is the JavaScript code snippet:

searhController.orderlogs.results = JSON.stringify(response.data);

This is how it's implemented in Angular:

<tr ng-hide="searhController.searching" ng-repeat="log in searhController.orderlogs.results">
                    <td>{{log.idTransaction}}</td>
                   <!-- <td>{{log.amount}}</td>
                    <td>{{log.clientName}}</td>
                    <td>{{log.created}}</td>
                    <td>{{log.currency}}</td>
                    <td>{{log.discountedAmount}}</td>
                    <td>{{log.lastUpdate}}</td>
                    <td>{{log.orderId}}</td> -->
                </tr>

The JSON data being used:

 [{"idTransaction":2081101,"amount":34990.0,"clientName":"Payment hub","created":"ene 12, 2015","currency":"CLP","discountedAmount":34990.0,"lastUpdate":"ene 12, 2015","orderId":"1421094905114","productDescription":"total: 1 item(s)","fop":{"nameFop":"CAT_FAKE"},"application": {"idApplication":10001,"nameApplication":"TEST APPLICATION"}, "transactionStatus":{"nameTransactionStatus":"Waiting for reply"}, "transactionByFop":{"settled_amount":0.0,"installments_amount":0.0,"installments_number":0}}]

The error message received:

angular.js:13920 Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: log in searhController.orderlogs.results, Duplicate key: string:a, Duplicate value: a

Answer №1

Your JSON code needs to be properly formatted because it's not small enough to be a one-liner. It should look like this:

{  
   "transaction":{  
      "idTransaction":2081101,
      "amount":34990.0,
      "clientName":"Payment hub",
      "created":"ene 12, 2015",
      "currency":"CLP",
      "discountedAmount":34990.0,
      "lastUpdate":"ene 12, 2015",
      "orderId":"1421094905114",
      "productDescription":"total: 1 item(s)",
      "fop":{  
         "nameFop":"CAT_FAKE"
      },
      "application":"",
      "idApplication":10001,
      "nameApplication":"TEST APPLICATION"
   },
   "transactionStatus":{  
      "nameTransactionStatus":"Waiting for reply"
   },
   "transactionByFop":"",
   "settled_amount":0.0,
   "installments_amount":0.0,
   "installments_number":0
}

I corrected your mistakes by filling in empty attributes and ensuring there is only one root element. Make sure to test if the corrected JSON works properly.

Answer №2

<tr ng-hide="searhController.searching" ng-repeat="log in searhController.orderlogs.results track by $index">
                <td>{{log.idTransaction}}</td>
               <!-- <td>{{log.amount}}</td>
                <td>{{log.clientName}}</td>
                <td>{{log.created}}</td>
                <td>{{log.currency}}</td>
                <td>{{log.discountedAmount}}</td>
                <td>{{log.lastUpdate}}</td>
                <td>{{log.orderId}}</td> -->
            </tr>

Remember to include track by $index at the end of your ng-repeat statement. This will ensure that each object is uniquely identified based on its position rather than its value, preventing duplicate objects from being incorrectly tracked.

Answer №3

Try this out,

ng-repeat="item in searchControl.orderHistory.results track by $index">

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

issue encountered when filling out a dropdown menu using a JSON data structure

Seeking assistance with populating a button dropdown in angularjs. Encountering the error message: "Unexpected end of expression: data.WotcSummary "|. Any ideas on what might be causing this issue? Here is the JavaScript file code snippet: WotcDashBoard ...

Error: The property 'parentNode' cannot be read because it is null

I wanted to test if my laptop can handle WebGL by loading examples from my instructor's webpage. The examples on the webpage worked fine, just showing a square within a square. I then decided to copy the exact codes into a notepad text editor, saved t ...

Unpredictable Redirection when URL is Clicked using PHP or Javascript

Looking to send users to a random URL from a specific list? For instance: With 3 URLs available - Google.com, Facebook.com, and Yahoo.com <a href="<?php $sites[array_rand($sites)] ?>">Click here</a> Upon clicking the link, users will ...

Generating JSON with backslashes and forward slashes using the Jackson library

Within a Java class, there exists a field String cardExpiration = "1022"; //Formatting can be adjusted The task at hand is to use the Jackson library to generate the following JSON: { "cardExpiration":"10\/22" } T ...

Tips for eliminating null values from a JavaScript object

I am currently facing an issue with a JavaScript object that consists of two arrays. At times, one of the arrays might be empty. I am attempting to iterate through the object using a recursive function, but I want to exclude any empty arrays or strings fro ...

I am interested in developing a JavaScript program that can calculate multiples of 0.10

I am looking to let users input values that are multiples of 0.10, such as - 0.10, 0.20, 0.30....1.00, 1.10, 1.20...1.90, and so on. When a user enters a value in the text box, I have been checking the following validation: amount % 0.10 == 0 Is this a ...

Transforming the output from a processor into an array structure

Being a newcomer in the field of development, I have a question about how to retrieve data based on my requirements and what is considered the best practice? This is the structure of my design: JavaScript (Ajax call) >> ashx handler (Access database and ...

Execute JavaScript function in NodeJS server background

I have developed a function that periodically monitors the battery statuses of connected android devices and returns an array. How can I execute this function on server startup and ensure it continues to run while sharing its information with other pages? ...

Changing the caret position in a contenteditable div using HTML React

In a recent project I worked on, I included contenteditable divs. Whenever the enter key is pressed within one of these divs, it splits into two separate contenteditable divs. However, after React re-renders the components, the caret tends to go to the beg ...

combine multiple keys into a single element with angular-translate

Within my application, I am retrieving translation keys from a single cell within a database table and dynamically displaying them on a settings page. While most entries will have just one key in the display object, there are some that contain multiple key ...

Can the AJAX URL be loaded onto a new page?

https://i.stack.imgur.com/5l63v.pngPardon the poorly phrased question, but I need some guidance on a specific requirement regarding opening a URL in a new page. Currently, I have designed an AJAX URL and I'm wondering if it's possible to open thi ...

sending an array from one CodeIgniter view to another view via Ajax

In the following code segments of my application, myArray is an array where each element contains a few objects that I need to use in a second view. When I use alert(myJSON);, I am able to see the array in the alert window. However, when the view loads, i ...

Having trouble with one of the stubs not working while unit testing with ava and sinon for an API call

Looking for advice on a test case I'm struggling with. The function I need to test involves 2 upper layer promise functions. I have stubbed all three functions, the first two are working fine but the last one is not functioning as expected. classD: c ...

"Could you please provide me with further details on how to use sequelize

I recently started working with node js and I used sequelize-auto to generate the models. However, I encountered an error when following the guidance provided in this link https://github.com/sequelize/sequelize-auto. If you need further clarification on th ...

What is the process for adding an additional level to an Object for an item that is not predefined?

The primary concern at hand is as follows: Retrieve JSON data from the server Populate a form with the data Serialize the form Create a JSON object with the correct structure Send the JSON object back to the server I am facing challenges specifically on ...

The PHP JSONPath and XPath filter to target specific elements is a powerful

Currently, I am working on utilizing JSONPath with PHP and have a requirement for the xpath equivalent to the contains filter, specifically "contains(dept, 'Management')". In my JSON data, I am looking to filter the staff members who belong to t ...

Creating Sub Menu in Blogger with pageListJSON

I am looking to enhance the menu on my blog by adding a sub-menu structure. Specifically, I want to organize my menu to include "Manual Testing" and "Automated Testing" as sub-menus under the main category of "Testing". Testing Manual Testing Automated ...

Angular directive has issues with $compile functionality

This Angular directive automatically appends a new HTML item to the page every time my model changes: app.directive('helloWorld', function($compile) { return { restrict: 'AE', replace: true, scope:{ ...

Issues with sending empty strings to an API in Vue Js

My code below is designed to update data using a Node Js REST API. The remaining field contains an equation using v-model=remaininginst to calculate and store the result in remaininginst. However, when I check the console.log, I am getting NaN empty data s ...

Simulated function invocation just one time

I am testing the functionality of two functions in the same file. One of the functions is supposed to call the other, and I need to verify that this interaction occurs. import * as strings from './strings'; const generateUuidSpy = jest.spyOn(st ...