Reached 10 iterations in the Digest, stopping due to a scope function problem

When processing data, I encounter a unique challenge where the information is returned in an unusual format (a single string representing all the options/labels of a radio button group).

For example:

"yes|Yes no|No"

To address this issue, I have developed a function in my controller that converts this data into an array of pair objects. The function works by iterating over the data and splitting it at the newline character. For each item in the resulting array, a pair object with 'value' and 'label' attributes is created and added to the final array. The output would resemble:

[{value:"yes", label:"Yes"},{value:"no"|label:"No"}]

My HTML markup includes the following:

<div ng-repeat="item in function(dataObj)"></div>

Although the function currently works without any issues, there seems to be an error because Angular anticipates the same object returning twice, as seen in other related threads. However, I am unsure how to resolve this problem.

While everything is functioning correctly now, I want to address this potential error before proceeding further.

Answer №1

When using ng-repeats, it's important to keep in mind that they are constantly re-evaluated during each digest cycle. This means that your function will be called repeatedly, creating a new object every time. As a result, Angular keeps re-evaluating the data, potentially causing the issue you've described (see full explanation here). It is recommended to call ng-repeat on static data for optimal performance:

$scope.data = function(dataObj);

Then, set up your markup like this:

<div ng-repeat="item in data"></div>

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

Maintain the state of the previous page in Vue to ensure continuity

Currently in the process of creating a small PWA to simulate an Android app, I have discovered Vuejs. However, I encountered an issue that has proven difficult to resolve. While scrolling through lists on the homepage for movies, TV shows, or news, clicki ...

Utilizing nodejs to interact with a web service

Recently diving into Node.js and currently exploring how to utilize services with NodeJS. Seeking guidance on the NodeJS equivalent of the code snippet provided below: $.ajax({ type: "POST", url: "/WebServiceUtility.aspx/CustomOrderService", data: " ...

What is the best way to organize a complicated array of arrays in JavaScript?

Within my code, there exists an array known as generationArray. Each array contained within generationArray consists of 252 elements. The first 250 elements serve as internal coding data, while the final two positions are designated for sorting criteria. T ...

What could be causing this compatibility issue between IE and Chrome? It's strange that the Table is displaying correctly only in Chrome

Recently, I encountered a challenge with my code in Chrome and realized that it also needs to work in Internet Explorer. Can someone assist me in making it fully functional in IE? I suspect that there might be specific code adjustments needed for IE as th ...

What is the process for integrating custom fields into a product using Stripe, and how can a stock limit be implemented for each customized field?

Currently, as I develop an ecommerce website using Next.js and integrate Stripe for checkout, I've come across the feature of custom fields in Stripe. This feature allows me to add options such as small, medium, and large for clothing sizes. However, ...

Discover Headphones with Ionic

Is there a way to detect if headphones are connected to a mobile device (specifically an iPhone) using Ionic? Our Ionic app plays sound normally without headphones, but encounters issues when headphones are plugged in. When you start the app without headp ...

Tips for maintaining the current object's status while utilizing ngFor in Angular

The JSON data provided is structured as follows. [ { "route":"vehicle", "next-route":"driver", "isActive":false }, { "title":"Driver", "route":"driver ...

Submitting the form with an extending controller results in an undefined state

I have a primary controller and another controller where I extend the primary one to display a different layout. Primary controller: function CustomerInformationController(...) { var vm = this; ... vm.save = function() { if (angular. ...

A step-by-step guide on showcasing Flickr images through API using a Justified Gallery

I am looking to integrate the Miromannino Justified Gallery () into my project, but I want it to showcase images fetched from Flickr. I have successfully implemented the code to retrieve photos from Flickr using the API through Ajax: $.ajax({ url ...

When it comes to HTML and Javascript drawing, getting the positioning just right can be a challenge

I'm currently developing a control website for a drawing robot as part of a school project. However, I've been facing some challenges with the functionality of the drawing feature. Though I admit that the site lacks attention to detail, my main ...

Error encountered: Unexpected character 'u' found at the start of JSON parsing. Position 0

Looking for guidance on writing jest test cases for a submit function that involves JSON.parse. The code and test case are provided below. handleFormSubmit = (e) => { e.preventDefault(); let requestData = JSON.parse ...

Show the date and time in a visually appealing way by using HTML and JavaScript in an HTA application with scrolling effects

I have the following JavaScript code to show the current date in the format Mon Jun 2 17:54:28 UTC+0530 2014 within an HTA (HTML application). Now, I would like to display it as a welcoming message along with the current system date and time: Mon Jun 2 17: ...

Having trouble changing the Font Awesome icon on click?

I'm struggling to figure out why I can't change a font awesome icon using a toggle. I've tried various solutions but nothing seems to be working. Any insights on what might be causing this issue? (HTML) <span class="toggle-icon" ...

Having trouble decoding URL in nodeJS

I have encountered an issue while using the express framework in NodeJS. I am attempting to send an activation link via email, but when activating the link, the URL becomes encoded and the express routes are unable to read it, leading to a 404 error page. ...

GTM - monitoring the most recent clicked element's input data

Custom Script function() { var inputs = document.getElementsByTagName("input"), selectedRadios = []; for (var i = 0;i < inputs.length;i++) { if(inputs[i].type==="checkbox" && inputs[i].checked) { selectedRadios.push(inputs[i].value); ...

The ng-click function seems to be unresponsive within the ion-scroll component, even though all $scope variables are contained within

I have encountered a problem in my code and created a sample on Plunker to demonstrate it. The issue is with the ng-click not functioning as expected. I attempted to resolve this by referencing a question on Stack Overflow titled Why do I need $parent to e ...

Should we retain the express variable for a specific purpose?

Being a developer who is still learning the ropes, I fail to understand the necessity of creating or retaining the express variable in an express/Node app. Instead of following this conventional approach: const express = require('express'); con ...

Troubleshooting issue with UI-router where views are not displaying

I am currently struggling to determine the most effective routing solution for my application, as I lack experience with ui-router and its recommended methods. My application will consist of the following elements: - navbar-div (state1) => always vis ...

Can you explain the significance of "@c.us" in the context of whatsapp-web.js?

Are there any references or resources available for using "@c.us" that I can consult? Here is an example: client.on('ready', () => { console.log('Client is ready!'); // Your message. const text = "Hey John"; // Obt ...

Bringing a .json Model into Three.js

Exploring Three.js for the first time and struggling with importing a .json model obtained from Clara.io For instance, I have downloaded this model: However, I can't seem to understand how to embed it into an HTML file. :( I attempted the following ...