JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app ng-controller="Controller">
    <table>
        <tr ng-repeat-start="item in items">
           <td>{{item.name}}</td>
           <td>{{item.population}}</td>
        </tr>
        <tr ng-repeat-end>
           <td>Expand/collapse content</td>
        </tr>   
    </table>
</div>

JavaScript

function Controller($scope) {

$scope.names = [
    { cid:1, mine: [
    {id:1,name:'Jani',country:'Norway'},
        {id:2,name:'Carl',country:'Sweden'}
    ]},
    {cid:2, mine: [
    {id:3,name:'Margareth',country:'England'},
        {id:4,name:'Hege',country:'Norway'},
        {id:5,name:'Joe',country:'Denmark'}
    ]},
    {cid:3, mine: [
    {id:6,name:'Gustav',country:'Sweden'},
        {id:7,name:'Birgit',country:'Denmark'},
        {id:8,name:'Mary',country:'England'},
        {id:9,name:'Kai',country:'Norway'}
    ]}
        ];

     $scope.items = [ 
        {
            name:'France',
            population:61.3,
            currency:'EUR',
            gpd:54
        },
        {
            name:'Germany',
            population:81.5,
            currency:'EUR',
            gpd:82
        },
        {
            name:'Spain',
            population:12.7,
            currency:'EUR',
            gpd:78
        },
        {
            name:'UK',
            population:51.3,
            currency:'GBR',
            gpd:64
        }];
}