Angular2 Count items inside of the array display information

angular angular2-components
rodboc picture rodboc · May 24, 2016 · Viewed 14.7k times · Source

Here again, I have the following component MyStoreComponent

 export class MyStoreComponent {
    stores: any[] = [{
        storeId: "456392",
        location: "New York",
        people: [{
            manager: "John",
            sales: "Claudia",
            tech: "Marcel"
        }, {
            manager: "Martin",
            sales: "Jenn",
            tech: "Oliver"
        }]
        }, {
        storeId: "456393",
        location: "California",
        people: [{
            manager: "Kim",
            sales: "Nancy",
            tech: "Marie"
        }]
    }];

 }

Now I am looking to count the people inside of each branch. For example 456392 has two manager or 456393 just have one

I tried myself with

 <ul *ngFor="#store of stores">
    <li *ngFor="#person of store.people">
        <span *ngIf="person.length > 1">Show this</span>
    </li>
 </ul>

But I am losing in some point, any help? please?

Answer

inoabrian picture inoabrian · May 24, 2016

Like awiseman mentioned it should be 

<ul *ngFor="#store of stores">
    <li *ngFor="#person of store.people">
        <span *ngIf="store.people.length > 1">Show this</span>
    </li>
 </ul>

Related questions

How to call another components function in angular2

I have two components as follows and I want to call a function from another component. Both components are included in the third parent component using directive. Component 1: @component( selector:'com1' ) export class com1{ function1(){...} } Component 2: @component( selector:'com2…

Read More
Angular - What is the meanings of module.id in component?

In an Angular app, I have seen that @Component has property moduleId. What does it mean? And when module.id is not defined anywhere, the app still works. How can it still work? @Component({ moduleId: module.id, selector: 'ng-app', templateUrl: …

Read More
Pass variable to custom component

I have my custom component: @Component({ selector: 'my-custom-component', templateUrl: './my-custom-component.html', styleUrls: ['./my-custom-component.css'] }) export class MyCustomComponent { constructor() { console.log('myCustomComponent'); } } I can use it like this: <my-custom-component></my-custom-component> But how I can pass …

Read More