En este momento tengo una llamada API exitosa que se muestra bien en la consola, pero ahora no estoy seguro de cómo mostrar estos datos de una manera como en esta imagen

Por el momento estoy usando una matriz en TS para hacerlo así:

 values = ["Wellbeing","Motivation", "Fitness","Assertiveness", "Productivity", "Resilience", "Teamwork","Emotional intelligence","Nutrition","Positivity/Perspective", "Communication (verbal)", "Navigating work","Communication (written)","Confidence","Work/Life",]

Y llamado en el HTML:

 <div *ngFor="let value of values"> <button #btn class= "selection_btn text-center" (click)="btn.classList.toggle('selected')" (click)="control.setValue(control.value.concat([value])) " >{{value}}</button> </div>

Y estos se muestran bien con algunos estilos CSS necesarios (eso es para otra pregunta), pero ¿cómo reemplazo esos valores con los nombres de API? La API está configurada en JSON así:

 [{"id":16,"categoryId":2,"name":"Culture"},]