find element in object typescript code

Question

In these products I want to find only element "product_id":"4" and display in view. Can you help please?

> let products= [ {"product_id":"1", "product_name":"Product1",
> "description":"Product1", "default_price":50, "lastmoduserid":"31",
> "lastmoddtm":"2018-02-06T13:26:17.000Z", "active":1},
> {"product_id":"2", "product_name":"Product2",
> "description":"Product2", "default_price":60, "lastmoduserid":"31",
> "lastmoddtm":"2018-02-06T13:35:17.000Z", "active":1},
> {"product_id":"3", "product_name":"Product3",
> "description":"Product3", "default_price":80, "lastmoduserid":"31",
> "lastmoddtm":"2018-02-06T13:35:22.000Z", "active":1},
> {"product_id":"4", "product_name":"Product4",
> "description":"Product4", "default_price":100, "lastmoduserid":"31",
> "lastmoddtm":"2018-02-06T13:25:54.000Z", "active":1},
> {"product_id":"5", "product_name":"Product5",
> "description":"Product5", "default_price":120, "lastmoduserid":"31",
> "lastmoddtm":"2018-02-06T13:35:27.000Z", "active":1} ]}

santosh singh · Accepted Answer · 2018-02-07 09:18:28Z

3

You can use array find method as shown below.

this.product = this.products.find(t=>t.product_id == "4");

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  products:any;
  product:any;
  json= `[ {"product_id":"1", "product_name":"Product1",
 "description":"Product1", "default_price":50, "lastmoduserid":"31",
 "lastmoddtm":"2018-02-06T13:26:17.000Z", "active":1},
 {"product_id":"2", "product_name":"Product2",
 "description":"Product2", "default_price":60, "lastmoduserid":"31",
 "lastmoddtm":"2018-02-06T13:35:17.000Z", "active":1},
 {"product_id":"3", "product_name":"Product3",
 "description":"Product3", "default_price":80, "lastmoduserid":"31",
 "lastmoddtm":"2018-02-06T13:35:22.000Z", "active":1},
 {"product_id":"4", "product_name":"Product4",
 "description":"Product4", "default_price":100, "lastmoduserid":"31",
 "lastmoddtm":"2018-02-06T13:25:54.000Z", "active":1},
 {"product_id":"5", "product_name":"Product5",
 "description":"Product5", "default_price":120, "lastmoduserid":"31",
 "lastmoddtm":"2018-02-06T13:35:27.000Z", "active":1} ]`

 constructor(){
   this.products=JSON.parse(this.json);
   this.product = this.products.find(t=>t.product_id == "4");
   console.log(this.product);
 }
}

DEMO

answered Feb 7, 2018 at 9:18

santosh singh

28.8k27 gold badges88 silver badges134 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

A. B Over a year ago

search(){ this.product = this.products.find(t=>t.product_id == "4");} ---in console it's ok. But when I want to display in html, like this: <p>{{search(product_name)}}<p> --> ERROR TypeError: Cannot read property 'find' of undefined. Please, how to display also in html only product_name. Thnx lot

santosh singh Over a year ago

check this demo link stackblitz.com/edit/angular-krf7nj?embed=1&file=app/…

Sajeetharan · Accepted Answer · 2018-02-07 09:03:19Z

2

You can use array.find()

this.product = this.products.find(t=>t.product_id == "4");

make sure to declare product

let product :any;

answered Feb 7, 2018 at 9:03

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Comments

Juan Garcia · Accepted Answer · 2018-02-07 09:08:15Z

1

you only need to use the function "find", if you execute this line of code you will obtain the object in "obtainedProduct" variable if not exists inside of the array then will return "obtainedProduct" variable with value undefined.

let obtainedProduct =  this.products.find(x => x.product_id == "4");

console.log(obtaniedProduct);

answered Feb 7, 2018 at 9:08

Juan Garcia

596 bronze badges

Comments

user7125929 · Accepted Answer · 2018-02-07 10:06:47Z

1

We can also use a filter. this.employees = this.employees.filter(x => x.id == this.employeeId)[0];

answered Feb 7, 2018 at 10:06

user7125929

855 bronze badges

Comments

Pramod Patil · Accepted Answer · 2018-02-07 09:07:44Z

0

You can use lodash find method

console.log(_.find(products,{"product_id":"4"}));

answered Feb 7, 2018 at 9:07

Pramod Patil

2,7632 gold badges16 silver badges20 bronze badges

Collectives™ on Stack Overflow

find element in object typescript code

5 Answers 5

2 Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related