How can I display custom object data to a cell in smart table?

I have a need to display a complex, custom object to a column rather than the typical primitives (number, boolean, string, etc.). How would I accomplish this with ng2 smart table? Below are my settings & data. As you can see, the "scopes" data is an array of custom objects. I would like to somehow loop through those and display them in a single cell:

` settings = {
columns: {
id: {
title: 'ID',
},
name: {
title: 'Full Name',
type: 'custom'
},
username: {
title: 'User Name',
},
link: {
title: 'Link',
type: 'html',
editor: {
type: 'custom',
component: CustomEditorComponent,
},
},
scopes: {
title: 'Scopes'
}
},
};`

` data = [
{
id: 1,
name: 'Leanne Graham',
username: 'Bret',
link: 'Google',
scopes: [
{
"name": "management:v1.0:clients:modify",
"displayName": "Write access to clients",
"description": "Allows to modify client (applications)",
"required": false,
"emphasize": false,
"showInDiscoveryDocument": false,
"userClaims": []
},
{
"name": "management:v1.0:clients",
"displayName": "Access to clients",
"description": "Allows access to Clients (applications) management API",
"required": false,
"emphasize": false,
"showInDiscoveryDocument": false,
"userClaims": []
},
{
"name": "management:v1.0:apis:modify",
"displayName": "Write access to resources",
"description": "Allows to modify resources (APIs)",
"required": false,
"emphasize": false,
"showInDiscoveryDocument": false,
"userClaims": []
},
{
"name": "management:v1.0:apis",
"displayName": "Access to resources",
"description": "Allows access to Resources (APIs) management API",
"required": false,
"emphasize": false,
"showInDiscoveryDocument": false,
"userClaims": []
}
]
},
{
id: 2,
name: 'Ervin Howell',
username: 'Antonette',
link: 'Ng2 Admin',
scopes: [
{
"name": "management:v1.0:clients:modify",
"displayName": "Write access to clients",
"description": "Allows to modify client (applications)",
"required": false,
"emphasize": false,
"showInDiscoveryDocument": false,
"userClaims": []
},
{
"name": "management:v1.0:clients",
"displayName": "Access to clients",
"description": "Allows access to Clients (applications) management API",
"required": false,
"emphasize": false,
"showInDiscoveryDocument": false,
"userClaims": []
},
]
},
{
id: 3,
name: 'Clementine Bauch',
username: 'Samantha',
link: 'Ng2 smart table',
scopes: [
{
"name": "management:v1.0:clients:modify",
"displayName": "Write access to clients",
"description": "Allows to modify client (applications)",
"required": false,
"emphasize": false,
"showInDiscoveryDocument": false,
"userClaims": []
},
]
},
{
id: 4,
name: 'Patricia Lebsack',
username: 'Karianne',
link: 'Blur Admin',
scopes: [
{
"name": "management:v1.0:clients:modify",
"displayName": "Write access to clients",
"description": "Allows to modify client (applications)",
"required": false,
"emphasize": false,
"showInDiscoveryDocument": false,
"userClaims": []
},
{
"name": "management:v1.0:clients",
"displayName": "Access to clients",
"description": "Allows access to Clients (applications) management API",
"required": false,
"emphasize": false,
"showInDiscoveryDocument": false,
"userClaims": []
},
{
"name": "management:v1.0:apis:modify",
"displayName": "Write access to resources",
"description": "Allows to modify resources (APIs)",
"required": false,
"emphasize": false,
"showInDiscoveryDocument": false,
"userClaims": []
},
]
}
];`