分组父子对象

Question

I am grouping objects in a table. For now I have a short working example on Plunker

Now I want to group multiple child objects to one parent object. The structure I want to achieve is

companyName(1), workers(3)
    worker name(1), some job
    worker name(2), some job
    worker name(3), some job

companyName(2), workers(4)
    worker name(1), some job
    worker name(2), some job
    worker name(3), some job
    worker name(4), some job

What is the best way to achieve this in angular? Is there an article about this? I tried looking myself but I couldn't find what I need.

Thanks for your time!

Answer 1

Arrange your data in the following structure.

$scope.companies = [
        { id: 0, name: "Meiks",  workers:[
            { id:1, firstName:"Joel", lastName:"Cash" },
            { id:2, firstName:"Christian", lastName:"Hamilton" },
            { id:3, firstName:"Cornelius", lastName:"Baldwin" }
        ]}  
        // ......

Use ng-repeat to render them.

    <div ng-repeat-start="company in companies" class="header">{{company.name}}</div>

       <div ng-repeat="worker in team.workers">{{worker.firstName}} {worker.lastName}}</div>

    <div ng-repeat-end><br /></div>