Selecting sub field in the nested object using TypeScript Angular 4

Question

I am trying to select an object array of nested object inside an array of o

export interface IDetails{
           _id?: string;
           order?: number;
           detaildesc?: string;
         }

    resl:any[];
    var data={
         locations: string;
         id: string;
         ordermain: number;
         value: string;
         details :[IDetails]
        }


I am trying to get list of all "order" under details:

    resl = this.data.forEach(a=> { a.details.map(x=>x.order});

I'm getting the following error:

type void is not assignable to type any[] for resl .

When I just make var resl, i get undefined error.

Please let me know how to fix that so I get array of details.order I checked around on the stackoverflow for possible solution couldnt find one that solves the issue.

Thanks

try to replace forEach cause it doesn't return anything, let result = this.data.details.map(row=> { row.order}); — styopdev
– styopdev, Commented Feb 13, 2019 at 15:11
@styopdev I cant do this.data.details.map ....because of I believe details is Interface because of it details has message details does not exist on type IDetails[ ] — J. Davidson
– J. Davidson, Commented Feb 13, 2019 at 15:31

Iftifar Taz · Accepted Answer · 2019-02-13 16:51:18Z

1

You can extract all orders with

    var ordersArr = data.map(x => {
        return x.details.map(y => {
            return y.order;
        });
    });

ordersArr would be an array of array. To flatten it youcan write

    var result = [].concat.apply([], ordersArr);

result would be array of all order values

You can also do the same thing with forEach instead of using map

    this.data.forEach(x => {
        x.details.forEach(y => {
            if (y.order) {
                this.resl.push(y.order);
            }
        });
    });

edited Feb 13, 2019 at 16:51

answered Feb 13, 2019 at 15:43

Iftifar Taz

8398 silver badges14 bronze badges

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

4 Comments

J. Davidson Over a year ago

I am getting red line under a saying [ts] can not find a

J. Davidson Over a year ago

It does run but returns empty array. I am wondering if it has to do with not all values of order exist. Some order values are null

J. Davidson Over a year ago

I can see the values now in the resl using browser tools. However when I use it in select using <option *ngFor="let ord of resl" [value]="ord.order'>{{ord.order}}</option> i get order not defined error? Thanks for your help finally getting some where

Iftifar Taz Over a year ago

I am assuming the data object is coming from a service call. You need to assign an empty array to resl before pushing new values to it. You can write this.resl = []; in your constructor

Nguyen Phong Thien · Accepted Answer · 2019-02-13 15:33:18Z

0

Your code seems to be not correct, so I assumed this is what you expected

export interface IDetails {
    _id?: string;
    order?: number;
    detaildesc?: string;
}

export class Something {
    resl: any[];
    data: {
        locations: string;
        id: string;
        ordermain: number;
        value: string;
        details: IDetails[];
    }[];

    aFunction() {
        this.resl = this.data.map(a => { a.details.map(x => x.order});
    }
}

and map, not forEach will returned a transformed array

answered Feb 13, 2019 at 15:33

Nguyen Phong Thien

3,3871 gold badge19 silver badges36 bronze badges

Collectives™ on Stack Overflow

Selecting sub field in the nested object using TypeScript Angular 4

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related