Can we iterate through a specific set of object attributes using ng-repeat?

Imagine I have the following:

$scope.listOfAttributes = ["someThings", "yetMoreThings"]     

$scope.whatever = {
    someThings: "stuff",
    otherThings: "Also stuff",
    yetMoreThings: "still stuff"
};

Can I achieve something like this:

<ul>
  <li ng-repeat="thing in listOfAttributes">{{ whatever.thing }}</li>
</ul>

or do I need to preprocess it like so:

$scope.generatedObject = {}
$scope.listOfAttributes.forEach(function(thing)){
    $scope.generatedObject[thing] = $scope.whatever[thing];
});

Answer №1

To implement bracket notation in your AngularJS code, follow this syntax:

<ul>
    <li ng-repeat="item in attributeList">{{ data[item] }}</li>
</ul>

Answer №2

Consider making a modification,

<li ng-repeat="item in listOfAttributes">{{ specific.item }}</li>

and update it with,

<li ng-repeat="item in listOfAttributes">{{ specific[item] }}</li>

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

Enhance the tooltip information on the Plotly chart by incorporating additional data points

I'm looking to enhance the tooltip by displaying additional data, but it's only showing %{customdata[0]} instead of the actual value. I've tried using customdata in the following way, but it doesn't seem to be working. { "name ...

What causes one CSS file's properties to be inherited by another CSS file in a React application?

I'm puzzled as to why my hero section file seems to be adopting the styling from the navbar CSS file. I do understand that the index.css file sets properties for the entire app, but in my case, I have separate CSS files for different components instea ...

JavaScript identifier used for a widget within the Odoo platform

Suppose you have two widget in a view. After performing an action on the first widget, you need to update the second widget by calling display_field. How can you determine the identifier for the second widget? For instance, in the extended definition of a ...

Parse the JSON data response as needed in ReactJS

var mydata = [ { source: 11, Registernumber: ">RT-113, <RT-333", jul1: 1004 }, { source: 11, Registernumber: ">RT-113, <RT-333", jul2: 1234 }, // Rest of the data entries... ]; Can we transform the above JSON ...

Change your favicon dynamically based on the user's online or offline status using Vue

I am currently working on setting up different icons to display when my browser is online (normal logo) and offline (greyed out logo). With Vue JS, I am able to detect the online and offline states, as well as set different favicons accordingly. However, t ...

Removing an Element According to Screen Size: A Step-by-Step Guide

Currently, I am facing a dilemma with two forms that need to share the same IDs. One form is designed for mobile viewing while the other is for all other devices. Despite using media queries and display: none to toggle their visibility, both forms are stil ...

The JavaScript exec() RegExp method retrieves a single item

Possible Duplicate: Question about regex exec returning only the first match "x1y2z3".replace(/[0-9]/g,"a") This code snippet returns "xayaza" as expected. /[0-9]/g.exec("x1y2z3") However, it only returns an array containing one item: ["1"]. S ...

"Encountered a problem during the installation of pm2 for Node.js

I am in the process of installing pm2 (https://github.com/Unitech/pm2) Encountered the following error while doing so: D:\_Work>npm install pm2 -g --unsafe-perm npm WARN `git config --get remote.origin.url` returned wrong result (http://ikt.pm ...

What is the method to execute a prototype function within another prototype?

I am facing an issue with my JavaScript class and need some help to resolve it. MyClass.prototype.foo = function() { return 0; } MyClass.prototype.bar = function() { return foo() + 1; } Unfortunately, when I try to run the program, it throws an ...

Exploring Node JS Express Thread Clarity

Having recently delved into the world of node js, I've familiarized myself with its architecture. I grasp the concept of the event loop, the main thread (V8 engine thread), and the other threads handled by libuv. When the main thread needs to handle ...

Ways to incorporate design elements for transitioning focus between different elements

When focusing on an element, I am using spatialNavigation with the following code: in index.html <script src="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="dfb5acf2acafbeabb6beb3f2b1bea9b6 ...

Find a specific value within a complex array of objects in Angular 2

Recently delving into Angular 2, I am seeking guidance on the best approach for a particular use-case. My array of Objects is structured as follows: users : Array<Object> = [{ id: 1, tags: [{ name: 'foo', age: 21 ...

Email address string loses the '+"' when using AJAX

My ajax code has been working well in most cases, but when I tried using it for updating user details on my page, I noticed that the ""+"" symbol was getting lost if used in an email address (such as <a href="/cdn-cgi/l/email-protection" class ...

How to utilize hbs variable in an external JavaScript file

Currently, I am utilizing hbs (express handlebars) to display a page. I am interested in retrieving some variables from chat.hbs and accessing them in an external file named chat.js on the client side. Server Side res.render('chat', {chatr ...

The webpage contains duplicate ID attribute value "x" that has been identified

In my Angular 7 project, three components (a, b, c) all use an input element with the same id of "x". However, component b has 4 input elements all using the id "x" as well. This poses Accessibility Issues as ids must be unique. The test cases utilize &apo ...

Is it the right time to implement a JavaScript framework?

Is there a need for using JavaScript frameworks like Angular or React if you are not developing single-page websites or components that receive live updates? ...

Inverting the order of vertices in a THREE.js face

I am seeking a way to reverse the order of vertices in faces within my geometry. For instance: // create geometry var geometry = new THREE.Geometry(); // create vertices geometry.vertices.push( new THREE.Vector3( 0, 0, 0 ) ); geometry.vertices.push( ...

What is the best way to retrieve information in an autosuggest textbox from a server or database?

I am looking for a way to modify my autosuggest textbox to fetch data from a server instead of a defined array. Can anyone provide guidance on how to achieve this? Here is the code snippet I am currently working with: HTML code- <!doctype html> &l ...

Embed a method within a class

My colleague's code that I need to integrate into my website is structured in a class and asynchronous style for the database. While I personally don't see the necessity for this approach, I have found that it is not harmful: const mongoose = re ...

JavaScript can be used to extract a specific value from a SOAP response

In order to extract the Patient ID (PATAA000000040) from the SOAP response below using JavaScript and insert it into a Mirth destination, we need to target the value under the livingSubjectId tag. It's important to note that this tag may repeat, but w ...