The issue of recursion not functioning properly with ng-include and ng-repeat arises beyond the initial level

I am trying to iterate through an object in order to fill a table dynamically.

To achieve this, I am utilizing ng-include and ng-repeat to loop through the object and generate a new <tr> for each element. However, I am encountering issues after the first level of iteration.

Check out my code on JSFiddle here!

Answer №1

Instead of creating new arrays, consider creating new objects in the following way:

  "nodes": [{
  "name": "Level 1",
  "att1": "att1-level1",
  "att2": "att2-level1"},
    {"name": "Level 2",
    "att1": "att1-level2",
    "att2": "att2-level2"},
    {
      "name": "Level 3A",
      "att1": "att1-level3a",
      "att2": "att2-level3a"}
    , {
      "name": "Level 3B",
      "att1": "att1-level3b",
      "att2": "att2-level3b"
    }]

This approach is effective!

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

Retrieving JSON information from an external API

Having trouble retrieving data from an API to populate the "output" div. The error message says that $ is undefined. Any ideas on what could be missing? <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http ...

Achieving success despite facing rejection

I am currently utilizing the bluebird settle method in order to verify results for promises without concerning myself with any rejections. Interestingly, even though I have rejected the promise within the secondMethod, the isFulfilled() still returns tru ...

Sequelize - Removing associations from the parent instance

I'm currently looking for a solution to remove specific rows from the database by using the parent model (menu) with multiple children (foods). My goal is to only delete certain rows and not all of them. Menu.js ... Menu.hasMany(models.Food, { as: & ...

Rules for validating string and numeric combinations in Vuetify are essential for ensuring accurate

Looking for guidance on implementing Vuetify validation to enforce rules (using :rules tag on a v-text-field) in the format of AB-12345678 (starting with two letters followed by a hyphen and then an 8-digit number). I'm having difficulty achieving thi ...

Issue with state change in Component (React with Redux)

I am another person facing a similar issue. I have been unable to identify the error in my code yet. I suspect it has something to do with mutation, but despite trying almost everything, I am at a loss. My component does not update when I add new items to ...

Following the execution of an AJAX request, the jquery script fails to run

I've encountered an issue with my website that utilizes pagination, filtering with jQuery and AJAX. Everything was functioning smoothly until I decided to switch my links to JavaScript links. When on the homepage without any filtering or pagination a ...

Encountering an Issue with Missing Registration Error When Making HTTPPost Requests to GCM in Google Apps Script

I am attempting to send an HTTP POST request to the GCM server using Google Apps Script. I have both the device ID and the necessary credentials. Below is the code I am currently using: function doThat(){ var url = "https://android.googleapis.com/gcm/se ...

What causes the temporary halt of context execution in the eventloop framework?

Presenting the code immediately: setTimeout(() => console.log("next macro")); /// next macro Promise.resolve().then(() => gen.next()) /// microtask inside, #2 const gen = (function*(){ console.log("Hello"); yield; /// #3 console.log("W ...

Managing mouse click events in jQuery

Here on SO, I successfully implemented the mouse down handler. Now, my goal is to separate these functions into their own file named test.js. Within test.js, the code looks like this: function handleMouseDown(e) { console.log('handleMouseDown&ap ...

Confirm the attributes of a table column

How can I ensure that a specific column in an HTML table is validated using a click function in JavaScript or jQuery? <table class="table table-bordered table-striped table-responsive" id="tableid"> <thead> <tr> ...

setting a variable with data retrieved from an AJAX call using jQuery

Here's a snippet of jquery code that I'm working with: var example = "example"; $.ajax({ url: root + "/servletPath", type: "GET", success: function (response) { alert(response); // displays the correct value example ...

Is there a way to call md-dialog onComplete in the dialog controller itself?

The onComplete function in $mdDialog.show is activated after the show action is finished. For more details, refer to https://material.angularjs.org/latest/api/service/$mdDialog#show. Is there a way to achieve the same onComplete feature within the dialog& ...

Sending a POST request using Node.js XHR

I am currently utilizing nodejs to send a POST command to a server. In this process, I am also making use of the node-xmlHttpRequest module created by driverdan. However, I am encountering a problem related to the content-type setting, which is resulting i ...

MongoDB's conditional aggregation function allows users to manipulate and aggregate data based

My mongodb contains data like this: { "_id": "a", "reply": "<", "criterion": "story" }, { "_id": "b", "reply": "<", "criterion": "story" }, { "_id": "c", "reply": ">", "criterion": "story" } What I need is the following result: ...

Access your Angular 5 application as a static webpage directly in your browser, no server required!

I need to run an Angular 5 application in a browser by manually opening the index.html file without the use of a server. My client does not have access to any servers and simply wants me to provide a package (dist folder) for them to double-click on the in ...

Show each individual layer from a KMZ file on a map with the ArcGIS API for JavaScript

Can I selectively show specific layers from a kmz file on my map? My current setup involves using the ArcGIS API for JavaScript. Specifically, I want to display only folders related to the current day outlook from a KMZ file provided by the NWS. There are ...

Looking to transfer data between pages using node.js and ejs for database access?

I am aiming to showcase the logged in username and quiz points on each page after the user logs in, and to increase the user's score when quiz answers are correct. I'm considering creating a straightforward JavaScript-based quiz, and then updati ...

Sending an image using AngularJS to a WCF RESTful service

This particular query has been raised numerous times, and I have extensively researched on Google (primarily stackoverflow), but none of the suggested solutions have worked for me. My goal is to upload an image (base64) to my WCF Service using angularjs. ...

"Troubleshooting: Resolving 404 Errors with JavaScript and CSS Files in a Vue.js and Node.js Application Deploy

I successfully developed a Vue.js + Node.js application on my local server. However, upon deploying it to a live server, I am facing a 404 error for the JavaScript and CSS files. I have double-checked that the files are indeed in the correct directories on ...

The Springboot endpoint was successfully submitted through a fetch request, leading to a redirection to

Facing an issue while trying to submit a form to the /policy-holder page using fetch in JavaScript. The endpoint is redirecting to the login page, even though only admins are supposed to login. What could be causing this problem and how can it be resolved? ...