Is there a way to choose values from an object array in Angular?

Question

Is there a way to choose values from an object array in Angular?

Within my Angular (TypeScript) Project, I am working with an object array.

let a = [{min:0, max:10},{min:10, max:810},{min:-10, max:110}];

My goal is to extract the minimum value of the min properties and the maximum value of the max properties. To achieve this, I want to create two variables as follows:

let min = // The minimum value from the min properties of all items would be -10;
let max = // The maximum value from the max properties of all items would be 810;

Is there a practical way, using lambda functions or other methods, to accomplish this task?

javascript angular typescript

Answer 1

Answer №1

To retrieve all the minimum and maximum values, you can utilize the map function along with Math.min and Math.max.

let a = [{min:0, max:10},{min:10, max:810},{min:-10, max:110}];

let min = Math.min(...a.map(o => o.min));
let max = Math.max(...a.map(o => o.max));

console.log(min);
console.log(max);

Alternatively, another method is to use reduce, which only requires looping through the array once.

let a = [{min:0, max:10},{min:10, max:810},{min:-10, max:110}];

let min = a.reduce((c, v) => v.min < c ? v.min : c, 0);
let max = a.reduce((c, v) => v.max > c ? v.max : c, 0);

console.log(min);
console.log(max);

Answer 2

To retrieve all the minimum and maximum values, you can utilize the map function along with Math.min and Math.max.

let a = [{min:0, max:10},{min:10, max:810},{min:-10, max:110}];

let min = Math.min(...a.map(o => o.min));
let max = Math.max(...a.map(o => o.max));

console.log(min);
console.log(max);

Alternatively, another method is to use reduce, which only requires looping through the array once.

let a = [{min:0, max:10},{min:10, max:810},{min:-10, max:110}];

let min = a.reduce((c, v) => v.min < c ? v.min : c, 0);
let max = a.reduce((c, v) => v.max > c ? v.max : c, 0);

console.log(min);
console.log(max);

Answer 3

Answer №2

Calculate the minimum value by using Math.min on a list of items and their minimum values.
Similarly, find the maximum value by applying Math.max to a collection of items and their maximum values.

Answer 4

Calculate the minimum value by using Math.min on a list of items and their minimum values.
Similarly, find the maximum value by applying Math.max to a collection of items and their maximum values.

Answer 5

Answer №3

Check out this method:

const values = [{low: 0, high: 10},{low: 10, high: 810},{low: -10, high: 110}];

    const minimum = Math.min(...values.map(item => item.low));
    const maximum = Math.max(...values.map(item => item.high));

Answer 6

Check out this method:

const values = [{low: 0, high: 10},{low: 10, high: 810},{low: -10, high: 110}];

    const minimum = Math.min(...values.map(item => item.low));
    const maximum = Math.max(...values.map(item => item.high));

Is there a way to choose values from an object array in Angular?

Answer №1

Answer №2

Answer №3

Similar questions

Invoking a function from a separate JavaScript file and finding out that an object is considered null

Having trouble getting the Angular Route to work, any tips on how to fix it?

What is the best way to resize an image to fit its surroundings within a nested box?

Using React and Material-UI to dynamically populate a table with data retrieved from

Tips for implementing the new useState value in your code

What might be causing the attribute of this Backbone model to be undefined when attempting to access it?

Error encountered when attempting to run an Angular 2 application with 'ng serve' command

What is the best way to enable and disable the edit-in-place feature using jQuery?

The error message "The type 'MouseEvent' is non-generic in TypeScript" popped up on the screen

The chosen Angular material pre-built theme of indigo-pink does not seem to be applied properly

Issue with React component not updating

Learn the steps to Toggle Javascript on window resize

Applying the power of Angular function binding within .html() function in d3 visualizations

What could be the issue with my code? (Threejs spotlight shadow)

Unable to access array in the result of a Node.js Mongoose find populate operation

What is the best way to use hasClass in a conditional statement to display text based on the content of a different div element?

When the mobile navigation bar is tapped, it remains open instead of closing

Tips for fading the text of list items when their checkbox is marked as done?

Is there a way to make a mat-form-field read-only?

Choose a word at random from a JSON string