ngRepeat is unable to loop through arrays within arrays

Is there a way to access the individual values within my array of arrays?

[
 ["0","0","0"],
 ["1","1","1"],
 ["1","0","0"]
]

I have attempted using two ngRepeat loops:

<ul>
  <li ng-repeat="line in test">
  {{line}}
    <ul>
      <li ng-repeat="point in line">
        {{point}}
      </li>
    </ul>
  </li>
</ul>

I feel like I'm missing something obvious. Any advice would be appreciated.

To view the code, please visit the following link: http://plnkr.co/edit/LeZw0HRab472dcNiHPQM?p=preview

javascriptangularjsangularjs-ng-repeat

Answer №1

Here is a potential solution for your inquiry:

<ul>
      <li ng-repeat="line in test">

        <ul>
          <li ng-repeat="point in line track by $index">
            {{point}}
          </li>
        </ul>
      </li>
    </ul>

Check out this demo to see it in action!

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

Experiencing difficulty incorporating navigation menu with AJAX request

Utilizing an AJAX request sourced from @minitech on Stack Overflow, I have encountered an issue where certain scripting (such as jQuery) is omitted when trying to load a page from a different source into the requesting page. This seems to function properly ...

javascripthtmlajaxget

Implementing the jQuery datepicker in Angular.js can be challenging

I recently started learning Angular.js and have been working on a web application using this framework. I am now looking to include a datepicker in one of my forms. Below is the code snippet that I have implemented: app.js myapp.directive(& ...

javascriptjqueryangularjsjquery-uidatepicker

Managing various conditions in React is crucial for proper functionality

I am facing an issue with the if statement related to creating conditions based on the number of objects in an array. Specifically, I need the condition to be true if there are 2 objects in the array and false if there is only 1 object. These objects are s ...

javascriptreactjs

Utilize a custom JQuery script on designated grid displays

I am facing a challenge in implementing a JQuery script on specific Gridviews within my page. The issue lies in the fact that the script is currently being applied to all Gridviews on the page, and I need a way to specify which grids it should apply to. T ...

javascriptjquerycssasp.netgridview

The issue of the cursor not showing up in Chrome within a nested contenteditable structure arises when applying CSS after the

Currently, I am coding a HTML document that includes an element with the attribute contenteditable set to true, but this element is wrapped inside a parent element with contenteditable set to false. The HTML structure looks like this: <div contentedita ...

javascriptjqueryhtmlcssgoogle-chrome

Implement conditional Axios cancellation within useEffect to handle API requests efficiently

I have a scenario where I have two buttons that display different content: Messages and Announcements. Let's say, upon initial load, an API call is made to fetch a list of Messages. Before the response is received from the API, if the user clicks on ...

javascriptreactjsreact-nativeaxios

Is there a way for me to navigate to the Google Map container div?

Imagine a scenario where I have a button at the top of the page and a Google Map at the bottom. Is it possible to scroll directly to the map by clicking on this button? I attempted using the "scrollTo" function after wrapping the Google map in a div, but ...

javascripthtmlangularjsgoogle-maps

How can we fix the null parameters being received by the ModelPage function?

I've been learning how to successfully pass values to a Post method using AJAX in .NET Core 6 Razor Pages, but I am encountering some difficulties. Below are the relevant codes: Front end: function calculateSalary() { var dropdown = document.get ...

javascriptc#ajaxasp.net-core.net-core

What is the best way to create individual links for each "actor" in a list using ReactJS?

Currently, I am working on a project that involves creating a Netflix-style app. When users click on a movie, it should display information about the movie along with a list of actors starring in it. My goal is to make each actor's name clickable so t ...

javascriptreactjsreact-router

Issue: jQuery Datatable not functioning properly while attempting to populate the table through JavaScript.Explanation: The

I'm currently working on populating a table using JavaScript. However, I've encountered an issue where the table is being populated but it shows "No data available in table". Furthermore, when I try to interact with the data, it disappears. This ...

javascriptjquerydatatables

Error: Trying to access property '1' of an undefined value is not allowed

I'm experiencing a problem that I can't seem to solve. The issue arises after the user logs in. I am using useEffect() to retrieve the user data by using a secret token from localstorage. Everything seems to be working fine - the data, the secret ...

javascriptreactjsarraysreact-hooks

Is it possible to merge upload file and text input code using AJAX?

For my form submissions using jQuery and Ajax, I'm trying to figure out how to send both data and files together. Currently, I have the following code: $("#save-sm").bind("click", function(event) { var url = "sm.input.php"; var v_name_sm = $(&ap ...

javascriptjqueryajaxfile-upload

Steps for creating an HTML report using Intern JS

Our team relies on intern JS for automating functional tests, however we are facing difficulty in generating an html report. I attempted to use locvhtml as suggested by the Intern documentation (https://theintern.github.io/intern/#reporter-lcov), but unfo ...

javascriptselenium-webdriverautomated-testsui-automationintern

What is the method for extracting a list of properties from an array of objects, excluding any items that contain a particular value?

I have an array of objects, and I want to retrieve a list with a specific property from those objects. However, the values in the list should only include objects that have another property set to a certain value. To clarify, consider the following example ...

javascriptarraysreactjsreact-nativesorting

The draggable=true attribute in EaselJS (MovieClip) canvas does not display a ghost image

I am currently working with a canvas element that contains animations powered by EaselJS. The canvas is wrapped in a parent div with draggable set to true. <div class="outer-parent" draggable="true"> <div class="inner-parent"> <canvas& ...

javascripthtmlhtml5-canvaseaseljscreatejs

What steps are involved in setting up a Restful API using express and node.js?

As a newcomer to node and express, I have been trying to understand how to create a rest API with node. Despite reading some documentation, I am still struggling to grasp the concept. Below is a basic code snippet where I attempt to create a GET API with e ...

angularjsnode.jsexpress

Utilizing dynamic variables in an angular ng-repeat loop

My goal is to have an overlay appear when focusing on a specific img element. However, the challenge lies in populating these elements from attributes within an angularjs ng-repeat. I want only certain images to trigger the display of a particular text. U ...

angularjs

When using console log, the object's keys and values display correctly, but they become undefined when attempting to access them

I am retrieving data from 2 different APIs - one for orders and one for workers. Both APIs have a workerId, so I need to link the information together to display each card with both order and worker details. For example, Order 1 - Tom, Order 3 - Jack... ...

javascriptjsonreactjsobject

I am having trouble with merging two JSON objects in JavaScript

There are no errors, but the features json object is not being added to the results json object Here is the code snippet: exports.getApps = function() { return new Promise(function(resolve, reject) { db.raw(` SELECT * FROM APPs WH ...

javascriptjsonnode.jsknex.js

What is the reason behind the particles being set at the center of the x-axis in THREE.JS?

I'm currently learning THREE.JS and I'm facing some challenges while trying to create a particle system. The issue I'm encountering is that all the particles seem to be aligned in the center on the X-axis, while the Y and Z axes appear to be ...

javascripthtmlcssthree.js