How can I populate an array with objects from a different array in Javascript using AngularJS?

Question

How can I populate an array with objects from a different array in Javascript using AngularJS?

Currently, I am facing a challenge in my angularjs application. I have a huge array containing the cast of a movie, which includes directors, producers, and film crew members. My goal is to create a new array specifically for the director(s).

I am unsure about how to filter and extract specific objects from one array to form a new array. To illustrate, consider this brief example:

this.products = [
  {name: "apple", category: "fruit"}, 
  {name: "iPhone", category: "tech"}, 
  {name: "banana", category: "fruit"}
];

this.fruits = [];

for(i = 0; i < products.length; i++) {
  if (products.category[i] == "fruit") {
    /*code to add object to fruits array*/
 }
}

I would greatly appreciate any assistance on how to achieve this task! Thank you!

javascript arrays angularjs

Answer 1

Answer №1

Check out this code snippet for a possible solution:

const items = [
    {name: "carrot", group: "vegetable"}, 
    {name: "laptop", group: "electronics"},
    {name: "pear", group: "fruit"}
];

const fruits = [];

for(let i = 0; i < items.length; i++) {
    if (items[i].group === "fruit") {
        /* Add object to fruits array */
        fruits.push(items[i].name);
    }
}

console.log(fruits);

Answer 2

Check out this code snippet for a possible solution:

const items = [
    {name: "carrot", group: "vegetable"}, 
    {name: "laptop", group: "electronics"},
    {name: "pear", group: "fruit"}
];

const fruits = [];

for(let i = 0; i < items.length; i++) {
    if (items[i].group === "fruit") {
        /* Add object to fruits array */
        fruits.push(items[i].name);
    }
}

console.log(fruits);

Answer 3

Answer №2

Check out this code snippet:

for(let count = 0; count < inventory.length; count++) {
    if (inventory[count].type == "vegetable") {
        veggies.push(inventory[count].title);
    }
}

Answer 4

Check out this code snippet:

for(let count = 0; count < inventory.length; count++) {
    if (inventory[count].type == "vegetable") {
        veggies.push(inventory[count].title);
    }
}

Answer 5

Answer №3

Utilize the filter method:

this.vegetables = this.items.filter(function(item) {
                  return item.type == 'vegetables';
              });

Answer 6

Utilize the filter method:

this.vegetables = this.items.filter(function(item) {
                  return item.type == 'vegetables';
              });

Answer 7

Answer №4

Here are the steps you can take to achieve this:

this.fruits = this.products.filter(p => p.category == "fruit").map(p => p.name);

When using the .filter() method, only objects with the correct category are selected. Next, the .map() function is used to iterate through this selection and extract only the name property values, resulting in ["apple", "banana"].

If you prefer to keep the objects intact, you can simply omit the .map() portion.

Check out this demonstration:

new (function () {
    this.products = [
      {name: "apple", category: "fruit"}, 
      {name: "iPhone", category: "tech"}, 
      {name: "banana", category: "fruit"}
    ];

    this.fruits = this.products.filter(p => p.category == "fruit").map(p => p.name);

    document.write(this.fruits);
});

Answer 8

Here are the steps you can take to achieve this:

this.fruits = this.products.filter(p => p.category == "fruit").map(p => p.name);

When using the .filter() method, only objects with the correct category are selected. Next, the .map() function is used to iterate through this selection and extract only the name property values, resulting in ["apple", "banana"].

If you prefer to keep the objects intact, you can simply omit the .map() portion.

Check out this demonstration:

new (function () {
    this.products = [
      {name: "apple", category: "fruit"}, 
      {name: "iPhone", category: "tech"}, 
      {name: "banana", category: "fruit"}
    ];

    this.fruits = this.products.filter(p => p.category == "fruit").map(p => p.name);

    document.write(this.fruits);
});

How can I populate an array with objects from a different array in Javascript using AngularJS?

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

The module 'PublicModule' was declared unexpectedly within the 'AppModule' in the Angular 4 component structure

Adding a React function to an external object without using React

modify the text inside a div when a radio button is clicked

What is the best way to transform an array of arrays into an array of objects using AngularJS?

How to dynamically alter a PHP variable using a JavaScript button click on the existing webpage

Utilizing ng-options to dynamically populate a select element with data received from a

Find common connections on Facebook using an app PRIOR to downloading it

Error in Discord Bot: discord.js showing TypeError when trying to read the length of an undefined property

What causes the delay in CSS animations?

Unable to access filteredItems from custom popup in uib-typeahead retrieval process

The server node proxy is failing to trigger the API call

Avoiding the use of if statements in Javascript

What occurs if the user navigates away from the page before the AJAX call has finished?

The supported browser is unable to import ES6 modules

Integrating the Angular Bootstrap datepicker into your Laravel application

Exploring the process of iterating through a JSON response in PHP to extract all values

Dealing with Unhandled Promise Rejections in Express.js

What is the best way to conceal an element in jQuery by utilizing a JavaScript variable?

Having difficulty implementing DragControls

What is the best way to attach several URLs to a single component?