diff --git a/src/app/components/admin-data-page/admin-data-page.component.html b/src/app/components/admin-data-page/admin-data-page.component.html
index efc6b9a..09f5f1e 100644
--- a/src/app/components/admin-data-page/admin-data-page.component.html
+++ b/src/app/components/admin-data-page/admin-data-page.component.html
@@ -36,7 +36,7 @@
 
     <ng-container matColumnDef="roles">
       <mat-header-cell *matHeaderCellDef mat-sort-header>Rollen</mat-header-cell>
-      <mat-cell *matCellDef="let row"> {{row.roles}}</mat-cell>
+      <mat-cell *matCellDef="let row"> {{row.rolesString}}</mat-cell>
     </ng-container>
 
     <!-- actions -->
diff --git a/src/app/components/admin-data-page/admin-data-page.component.ts b/src/app/components/admin-data-page/admin-data-page.component.ts
index ea60eef..64ff1b8 100644
--- a/src/app/components/admin-data-page/admin-data-page.component.ts
+++ b/src/app/components/admin-data-page/admin-data-page.component.ts
@@ -35,6 +35,7 @@ export class AdminDataPageComponent implements OnInit {
   dataSource : MatTableDataSource<User>;
   index: number;
   id: number;
+  roles;
 
   constructor(public httpClient: HttpClient,
               public dialog: MatDialog,
@@ -70,8 +71,11 @@ export class AdminDataPageComponent implements OnInit {
   }
 
   startEdit(user : User) {
+    let dialogData = deepCopy(user);
+    dialogData.rolesData = deepCopy(roles);
     const dialogRef = this.dialog.open(EditDialogComponent, {
-      data: deepCopy(user)
+      data: deepCopy(user),
+      
     });
 
     dialogRef.afterClosed().subscribe(result => {
@@ -112,6 +116,13 @@ export class AdminDataPageComponent implements OnInit {
 
   public loadData() {
     this.userService.getAllUsers().pipe(first()).subscribe((data: User[]) => {
+      for (let user of data){
+        let roles = [];
+        for (let role of user.roles){
+          roles.push(role.name);
+        }
+        user.rolesString = roles.join(', ');
+      }
       this.dataSource = new MatTableDataSource(data);
     });
     fromEvent(this.filter.nativeElement, 'keyup')
diff --git a/src/app/components/dialogs/edit/edit.dialog.component.ts b/src/app/components/dialogs/edit/edit.dialog.component.ts
index ab75ced..6af9826 100644
--- a/src/app/components/dialogs/edit/edit.dialog.component.ts
+++ b/src/app/components/dialogs/edit/edit.dialog.component.ts
@@ -15,7 +15,8 @@ export class EditDialogComponent {
   hide = true;
 
   constructor(public dialogRef: MatDialogRef<EditDialogComponent>,
-              @Inject(MAT_DIALOG_DATA) public data: any, public userService: UserService, public snackbarService : SnackBarService) { }
+              @Inject(MAT_DIALOG_DATA) public data: any,
+              @Inject(MAT_DIALOG_DATA) public role: any, public userService: UserService, public snackbarService : SnackBarService) { }
 
   formControl = new FormControl('', [
     Validators.required
diff --git a/src/app/models/user.ts b/src/app/models/user.ts
index 4a9881e..d2ba87b 100644
--- a/src/app/models/user.ts
+++ b/src/app/models/user.ts
@@ -10,8 +10,15 @@ export class User {
     email: string;
     own_password: string;
     password: string;
-    roles: string[];
+    roles: UserRole[];
+    rolesString? : string;
     attributes : {
         profile_url?: string;
     }
+}
+
+export class UserRole {
+    id: number;
+    name: string;
+    description: string;
 }
\ No newline at end of file
diff --git a/src/app/services/role.service.ts b/src/app/services/role.service.ts
index ce96cb4..8cc13c9 100644
--- a/src/app/services/role.service.ts
+++ b/src/app/services/role.service.ts
@@ -3,7 +3,7 @@ import { HttpClient } from '@angular/common/http';
 import { catchError, finalize, map, tap } from 'rxjs/operators';
 import { environment } from '../../environments/environment';
 import { Observable, BehaviorSubject, of } from 'rxjs';
-import { User } from "../models/user";
+import { Role } from "../models/user";
 import { AuthService} from "./auth.service";
 import { ObserveOnSubscriber } from 'rxjs/internal/operators/observeOn';
 
@@ -18,24 +18,27 @@ export class RoleService {
   }
 
 
-  public getAllUsers(): Observable<User[]> {
-    return this.http.get<User[]>(`${environment.authUrl}/users`);
+  public getAllRoles(): Observable<Role[]> {
+    return this.http.get<Role[]>(`${environment.authUrl}/roles`);
   }
 
-  public getUser(email: string): Observable<User> {
-    return this.http.get<User>(`${environment.authUrl}/users/${email}`);
+  public addRole(user : Role){
+    return this.http.post<Role>(
+      `${environment.authUrl}/roles/create`,
+      user
+    );
   }
 
-  public getUserPermissions(email: string): Observable<any> {
-    return this.http.get<any>(`${environment.authUrl}/users/${email}/permissions`)
+  public getRole(name: string): Observable<Role> {
+    return this.http.get<Role>(`${environment.authUrl}/roles/${name}`);
   }
 
-  public updateUser(user: User): Observable<User> {
-    return this.http.post<User>(`${environment.authUrl}/users/${user.email}/update`, user);
+  public updateRole(role: Role): Observable<Role> {
+    return this.http.post<Role>(`${environment.authUrl}/roles/${role.name}/update`, role);
   }
 
-  public deleteUser(email: string): Observable<any> {
-    return this.http.delete<any>(`${environment.authUrl}/users/` + email + "/delete");
+  public deleteRole(name: string): Observable<any> {
+    return this.http.delete<any>(`${environment.authUrl}/roles/` + name + "/delete");
   }
 
 }