solved user api call problem

README.md

@@ -31,10 +31,13 @@
   - "generate:api": "openapi-generator-cli generate -i ./openapi.yaml -g typescript-angular -o src/app/core/api/v1 -p=removeOperationIdPrefix=true"
 - Java must be installed
 - cd matsen-tool
-- npm run generate:api
+
+## Generate services from openapi.yaml
+- run sh generateApi.sh
+- (npm run generate:api
   - Wenn es nicht geht: brew install java
   - sudo ln -sfn /opt/homebrew/opt/openjdk/libexec/openjdk.jdk /Library/Java/JavaVirtualMachines/openjdk.jdk
-  - java -version
+  - java -version)
 
 ## Module anlegen
 - cd app

matsen-tool/openapi.yaml

@@ -419,6 +419,42 @@ paths:
         required: true
       deprecated: false
     parameters: []
+  /auth:
+    post:
+      operationId: login_check_post
+      tags:
+        - 'Login Check'
+      responses:
+        200:
+          description: 'User token created'
+          content:
+            application/json:
+              schema:
+                type: object
+                properties:
+                  token: { readOnly: true, type: string, nullable: false }
+                required:
+                  - token
+      summary: 'Creates a user token.'
+      description: 'Creates a user token.'
+      requestBody:
+        description: 'The login data'
+        content:
+          application/json:
+            schema:
+              type: object
+              properties:
+                email:
+                  type: string
+                  nullable: false
+                password:
+                  type: string
+                  nullable: false
+              required:
+                - email
+                - password
+        required: true
+    parameters: []
 components:
   schemas:
     Post:
@@ -438,6 +474,7 @@ components:
             - string
             - 'null'
           format: iri-reference
+          example: 'https://example.com/'
         createdAt:
           readOnly: true
           type:
@@ -470,6 +507,7 @@ components:
             - string
             - 'null'
           format: iri-reference
+          example: 'https://example.com/'
         createdAt:
           readOnly: true
           type:
@@ -516,6 +554,7 @@ components:
             - string
             - 'null'
           format: iri-reference
+          example: 'https://example.com/'
         createdAt:
           readOnly: true
           type:
@@ -565,6 +604,7 @@ components:
           items:
             type: string
             format: iri-reference
+            example: 'https://example.com/'
     User.jsonhal:
       type: object
       description: ''
@@ -617,6 +657,7 @@ components:
           items:
             type: string
             format: iri-reference
+            example: 'https://example.com/'
     User.jsonld:
       type: object
       description: ''
@@ -683,11 +724,19 @@ components:
           items:
             type: string
             format: iri-reference
+            example: 'https://example.com/'
   responses: {  }
   parameters: {  }
   examples: {  }
   requestBodies: {  }
   headers: {  }
-  securitySchemes: {  }
-security: []
+  securitySchemes:
+    JWT:
+      type: http
+      scheme: bearer
+      bearerFormat: JWT
+security:
+  -
+    JWT: []
 tags: []
+

matsen-tool/src/app/_helpers/error.interceptor.ts

@@ -17,7 +17,6 @@ export class ErrorInterceptor implements HttpInterceptor {
             }
 
             const error = err.error?.message || err.statusText;
-            console.error(err);
             return throwError(() => error);
         }))
     }

matsen-tool/src/app/_helpers/fake-backend.ts

@@ -1,138 +0,0 @@
-import { Injectable } from '@angular/core';
-import { HttpRequest, HttpResponse, HttpHandler, HttpEvent, HttpInterceptor, HTTP_INTERCEPTORS } from '@angular/common/http';
-import { Observable, of, throwError } from 'rxjs';
-import { delay, materialize, dematerialize } from 'rxjs/operators';
-
-// array in local storage for registered users
-const usersKey = 'angular-14-registration-login-example-users';
-let users: any[] = JSON.parse(localStorage.getItem(usersKey)!) || [];
-
-@Injectable()
-export class FakeBackendInterceptor implements HttpInterceptor {
-    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
-        const { url, method, headers, body } = request;
-
-        return handleRoute();
-
-        function handleRoute() {
-            switch (true) {
-                case url.endsWith('/users/authenticate') && method === 'POST':
-                    return authenticate();
-                case url.endsWith('/users/register') && method === 'POST':
-                    return register();
-                case url.endsWith('/users') && method === 'GET':
-                    return getUsers();
-                case url.match(/\/users\/\d+$/) && method === 'GET':
-                    return getUserById();
-                case url.match(/\/users\/\d+$/) && method === 'PUT':
-                    return updateUser();
-                case url.match(/\/users\/\d+$/) && method === 'DELETE':
-                    return deleteUser();
-                default:
-                    // pass through any requests not handled above
-                    return next.handle(request);
-            }
-        }
-
-        // route functions
-
-        function authenticate() {
-            const { username, password } = body;
-            const user = users.find(x => x.username === username && x.password === password);
-            if (!user) return error('Username or password is incorrect');
-            return ok({
-                ...basicDetails(user),
-                token: 'fake-jwt-token'
-            })
-        }
-
-        function register() {
-            const user = body
-
-            if (users.find(x => x.username === user.username)) {
-                return error('Username "' + user.username + '" is already taken')
-            }
-
-            user.id = users.length ? Math.max(...users.map(x => x.id)) + 1 : 1;
-            users.push(user);
-            localStorage.setItem(usersKey, JSON.stringify(users));
-            return ok();
-        }
-
-        function getUsers() {
-            if (!isLoggedIn()) return unauthorized();
-            return ok(users.map(x => basicDetails(x)));
-        }
-
-        function getUserById() {
-            if (!isLoggedIn()) return unauthorized();
-
-            const user = users.find(x => x.id === idFromUrl());
-            return ok(basicDetails(user));
-        }
-
-        function updateUser() {
-            if (!isLoggedIn()) return unauthorized();
-
-            let params = body;
-            let user = users.find(x => x.id === idFromUrl());
-
-            // only update password if entered
-            if (!params.password) {
-                delete params.password;
-            }
-
-            // update and save user
-            Object.assign(user, params);
-            localStorage.setItem(usersKey, JSON.stringify(users));
-
-            return ok();
-        }
-
-        function deleteUser() {
-            if (!isLoggedIn()) return unauthorized();
-
-            users = users.filter(x => x.id !== idFromUrl());
-            localStorage.setItem(usersKey, JSON.stringify(users));
-            return ok();
-        }
-
-        // helper functions
-
-        function ok(body?: any) {
-            return of(new HttpResponse({ status: 200, body }))
-                .pipe(delay(500)); // delay observable to simulate server api call
-        }
-
-        function error(message: string) {
-            return throwError(() => ({ error: { message } }))
-                .pipe(materialize(), delay(500), dematerialize()); // call materialize and dematerialize to ensure delay even if an error is thrown (https://github.com/Reactive-Extensions/RxJS/issues/648);
-        }
-
-        function unauthorized() {
-            return throwError(() => ({ status: 401, error: { message: 'Unauthorized' } }))
-                .pipe(materialize(), delay(500), dematerialize());
-        }
-
-        function basicDetails(user: any) {
-            const { id, username, firstName, lastName } = user;
-            return { id, username, firstName, lastName };
-        }
-
-        function isLoggedIn() {
-            return headers.get('Authorization') === 'Bearer fake-jwt-token';
-        }
-
-        function idFromUrl() {
-            const urlParts = url.split('/');
-            return parseInt(urlParts[urlParts.length - 1]);
-        }
-    }
-}
-
-export const fakeBackendProvider = {
-    // use fake backend in place of Http service for backend-less development
-    provide: HTTP_INTERCEPTORS,
-    useClass: FakeBackendInterceptor,
-    multi: true
-};

matsen-tool/src/app/app.module.ts

@@ -3,9 +3,6 @@ import {BrowserModule} from '@angular/platform-browser';
 import {ReactiveFormsModule} from '@angular/forms';
 import {HttpClientModule, HTTP_INTERCEPTORS, HttpClient} from '@angular/common/http';
 
-// used to create fake backend
-import {fakeBackendProvider} from './_helpers';
-
 import {AppRoutingModule} from './app-routing.module';
 import {JwtInterceptor, ErrorInterceptor} from './_helpers';
 import {AppComponent} from './app.component';
@@ -74,8 +71,6 @@ export function HttpLoaderFactory(http: HttpClient) {
         {provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true},
         {provide: HTTP_INTERCEPTORS, useClass: ErrorInterceptor, multi: true},
 
-        // provider used to create fake backend
-        fakeBackendProvider
     ],
     bootstrap: [AppComponent]
 })

matsen-tool/src/app/core/api/v1/.openapi-generator/FILES

@@ -2,6 +2,7 @@
 README.md
 api.module.ts
 api/api.ts
+api/loginCheck.service.ts
 api/post.service.ts
 api/user.service.ts
 configuration.ts
@@ -17,6 +18,8 @@ model/apiPostsGetCollection200ResponseHydraSearchHydraMappingInner.ts
 model/apiPostsGetCollection200ResponseHydraView.ts
 model/apiUsersGetCollection200Response.ts
 model/apiUsersGetCollection200Response1.ts
+model/loginCheckPost200Response.ts
+model/loginCheckPostRequest.ts
 model/models.ts
 model/post.ts
 model/postJsonhal.ts

matsen-tool/src/app/core/api/v1/api/api.ts

@@ -1,5 +1,7 @@
+export * from './loginCheck.service';
+import { LoginCheckService } from './loginCheck.service';
 export * from './post.service';
 import { PostService } from './post.service';
 export * from './user.service';
 import { UserService } from './user.service';
-export const APIS = [PostService, UserService];
+export const APIS = [LoginCheckService, PostService, UserService];

matsen-tool/src/app/core/api/v1/api/loginCheck.service.ts

@@ -0,0 +1,172 @@
+/**
+ * Matsen API Platform
+ * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
+ *
+ * The version of the OpenAPI document: 1.0.0
+ * 
+ *
+ * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
+ * https://openapi-generator.tech
+ * Do not edit the class manually.
+ */
+/* tslint:disable:no-unused-variable member-ordering */
+
+import { Inject, Injectable, Optional }                      from '@angular/core';
+import { HttpClient, HttpHeaders, HttpParams,
+         HttpResponse, HttpEvent, HttpParameterCodec, HttpContext 
+        }       from '@angular/common/http';
+import { CustomHttpParameterCodec }                          from '../encoder';
+import { Observable }                                        from 'rxjs';
+
+// @ts-ignore
+import { LoginCheckPost200Response } from '../model/loginCheckPost200Response';
+// @ts-ignore
+import { LoginCheckPostRequest } from '../model/loginCheckPostRequest';
+
+// @ts-ignore
+import { BASE_PATH, COLLECTION_FORMATS }                     from '../variables';
+import { Configuration }                                     from '../configuration';
+
+
+
+@Injectable({
+  providedIn: 'root'
+})
+export class LoginCheckService {
+
+    protected basePath = 'http://localhost';
+    public defaultHeaders = new HttpHeaders();
+    public configuration = new Configuration();
+    public encoder: HttpParameterCodec;
+
+    constructor(protected httpClient: HttpClient, @Optional()@Inject(BASE_PATH) basePath: string|string[], @Optional() configuration: Configuration) {
+        if (configuration) {
+            this.configuration = configuration;
+        }
+        if (typeof this.configuration.basePath !== 'string') {
+            if (Array.isArray(basePath) && basePath.length > 0) {
+                basePath = basePath[0];
+            }
+
+            if (typeof basePath !== 'string') {
+                basePath = this.basePath;
+            }
+            this.configuration.basePath = basePath;
+        }
+        this.encoder = this.configuration.encoder || new CustomHttpParameterCodec();
+    }
+
+
+    // @ts-ignore
+    private addToHttpParams(httpParams: HttpParams, value: any, key?: string): HttpParams {
+        if (typeof value === "object" && value instanceof Date === false) {
+            httpParams = this.addToHttpParamsRecursive(httpParams, value);
+        } else {
+            httpParams = this.addToHttpParamsRecursive(httpParams, value, key);
+        }
+        return httpParams;
+    }
+
+    private addToHttpParamsRecursive(httpParams: HttpParams, value?: any, key?: string): HttpParams {
+        if (value == null) {
+            return httpParams;
+        }
+
+        if (typeof value === "object") {
+            if (Array.isArray(value)) {
+                (value as any[]).forEach( elem => httpParams = this.addToHttpParamsRecursive(httpParams, elem, key));
+            } else if (value instanceof Date) {
+                if (key != null) {
+                    httpParams = httpParams.append(key, (value as Date).toISOString().substring(0, 10));
+                } else {
+                   throw Error("key may not be null if value is Date");
+                }
+            } else {
+                Object.keys(value).forEach( k => httpParams = this.addToHttpParamsRecursive(
+                    httpParams, value[k], key != null ? `${key}.${k}` : k));
+            }
+        } else if (key != null) {
+            httpParams = httpParams.append(key, value);
+        } else {
+            throw Error("key may not be null if value is not object or array");
+        }
+        return httpParams;
+    }
+
+    /**
+     * Creates a user token.
+     * Creates a user token.
+     * @param loginCheckPostRequest The login data
+     * @param observe set whether or not to return the data Observable as the body, response or events. defaults to returning the body.
+     * @param reportProgress flag to report request and response progress.
+     */
+    public checkPost(loginCheckPostRequest: LoginCheckPostRequest, observe?: 'body', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<LoginCheckPost200Response>;
+    public checkPost(loginCheckPostRequest: LoginCheckPostRequest, observe?: 'response', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<HttpResponse<LoginCheckPost200Response>>;
+    public checkPost(loginCheckPostRequest: LoginCheckPostRequest, observe?: 'events', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<HttpEvent<LoginCheckPost200Response>>;
+    public checkPost(loginCheckPostRequest: LoginCheckPostRequest, observe: any = 'body', reportProgress: boolean = false, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<any> {
+        if (loginCheckPostRequest === null || loginCheckPostRequest === undefined) {
+            throw new Error('Required parameter loginCheckPostRequest was null or undefined when calling checkPost.');
+        }
+
+        let localVarHeaders = this.defaultHeaders;
+
+        let localVarCredential: string | undefined;
+        // authentication (JWT) required
+        localVarCredential = this.configuration.lookupCredential('JWT');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
+        let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
+        if (localVarHttpHeaderAcceptSelected === undefined) {
+            // to determine the Accept header
+            const httpHeaderAccepts: string[] = [
+                'application/json'
+            ];
+            localVarHttpHeaderAcceptSelected = this.configuration.selectHeaderAccept(httpHeaderAccepts);
+        }
+        if (localVarHttpHeaderAcceptSelected !== undefined) {
+            localVarHeaders = localVarHeaders.set('Accept', localVarHttpHeaderAcceptSelected);
+        }
+
+        let localVarHttpContext: HttpContext | undefined = options && options.context;
+        if (localVarHttpContext === undefined) {
+            localVarHttpContext = new HttpContext();
+        }
+
+
+        // to determine the Content-Type header
+        const consumes: string[] = [
+            'application/json'
+        ];
+        const httpContentTypeSelected: string | undefined = this.configuration.selectHeaderContentType(consumes);
+        if (httpContentTypeSelected !== undefined) {
+            localVarHeaders = localVarHeaders.set('Content-Type', httpContentTypeSelected);
+        }
+
+        let responseType_: 'text' | 'json' | 'blob' = 'json';
+        if (localVarHttpHeaderAcceptSelected) {
+            if (localVarHttpHeaderAcceptSelected.startsWith('text')) {
+                responseType_ = 'text';
+            } else if (this.configuration.isJsonMime(localVarHttpHeaderAcceptSelected)) {
+                responseType_ = 'json';
+            } else {
+                responseType_ = 'blob';
+            }
+        }
+
+        let localVarPath = `/auth`;
+        return this.httpClient.request<LoginCheckPost200Response>('post', `${this.configuration.basePath}${localVarPath}`,
+            {
+                context: localVarHttpContext,
+                body: loginCheckPostRequest,
+                responseType: <any>responseType_,
+                withCredentials: this.configuration.withCredentials,
+                headers: localVarHeaders,
+                observe: observe,
+                reportProgress: reportProgress
+            }
+        );
+    }
+
+}

matsen-tool/src/app/core/api/v1/api/post.service.ts

@@ -119,6 +119,13 @@ export class PostService {
 
         let localVarHeaders = this.defaultHeaders;
 
+        let localVarCredential: string | undefined;
+        // authentication (JWT) required
+        localVarCredential = this.configuration.lookupCredential('JWT');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
         let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
         if (localVarHttpHeaderAcceptSelected === undefined) {
             // to determine the Accept header
@@ -182,6 +189,13 @@ export class PostService {
 
         let localVarHeaders = this.defaultHeaders;
 
+        let localVarCredential: string | undefined;
+        // authentication (JWT) required
+        localVarCredential = this.configuration.lookupCredential('JWT');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
         let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
         if (localVarHttpHeaderAcceptSelected === undefined) {
             // to determine the Accept header
@@ -240,6 +254,13 @@ export class PostService {
 
         let localVarHeaders = this.defaultHeaders;
 
+        let localVarCredential: string | undefined;
+        // authentication (JWT) required
+        localVarCredential = this.configuration.lookupCredential('JWT');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
         let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
         if (localVarHttpHeaderAcceptSelected === undefined) {
             // to determine the Accept header
@@ -306,6 +327,13 @@ export class PostService {
 
         let localVarHeaders = this.defaultHeaders;
 
+        let localVarCredential: string | undefined;
+        // authentication (JWT) required
+        localVarCredential = this.configuration.lookupCredential('JWT');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
         let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
         if (localVarHttpHeaderAcceptSelected === undefined) {
             // to determine the Accept header
@@ -378,6 +406,13 @@ export class PostService {
 
         let localVarHeaders = this.defaultHeaders;
 
+        let localVarCredential: string | undefined;
+        // authentication (JWT) required
+        localVarCredential = this.configuration.lookupCredential('JWT');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
         let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
         if (localVarHttpHeaderAcceptSelected === undefined) {
             // to determine the Accept header

matsen-tool/src/app/core/api/v1/api/user.service.ts

@@ -119,6 +119,13 @@ export class UserService {
 
         let localVarHeaders = this.defaultHeaders;
 
+        let localVarCredential: string | undefined;
+        // authentication (JWT) required
+        localVarCredential = this.configuration.lookupCredential('JWT');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
         let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
         if (localVarHttpHeaderAcceptSelected === undefined) {
             // to determine the Accept header
@@ -182,6 +189,13 @@ export class UserService {
 
         let localVarHeaders = this.defaultHeaders;
 
+        let localVarCredential: string | undefined;
+        // authentication (JWT) required
+        localVarCredential = this.configuration.lookupCredential('JWT');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
         let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
         if (localVarHttpHeaderAcceptSelected === undefined) {
             // to determine the Accept header
@@ -248,6 +262,13 @@ export class UserService {
 
         let localVarHeaders = this.defaultHeaders;
 
+        let localVarCredential: string | undefined;
+        // authentication (JWT) required
+        localVarCredential = this.configuration.lookupCredential('JWT');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
         let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
         if (localVarHttpHeaderAcceptSelected === undefined) {
             // to determine the Accept header
@@ -320,6 +341,13 @@ export class UserService {
 
         let localVarHeaders = this.defaultHeaders;
 
+        let localVarCredential: string | undefined;
+        // authentication (JWT) required
+        localVarCredential = this.configuration.lookupCredential('JWT');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
         let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
         if (localVarHttpHeaderAcceptSelected === undefined) {
             // to determine the Accept header

matsen-tool/src/app/core/api/v1/configuration.ts

@@ -86,6 +86,15 @@ export class Configuration {
         else {
             this.credentials = {};
         }
+
+        // init default JWT credential
+        if (!this.credentials['JWT']) {
+            this.credentials['JWT'] = () => {
+                return typeof this.accessToken === 'function'
+                    ? this.accessToken()
+                    : this.accessToken;
+            };
+        }
     }
 
     /**

matsen-tool/src/app/core/api/v1/model/loginCheckPost200Response.ts

@@ -0,0 +1,17 @@
+/**
+ * Matsen API Platform
+ * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
+ *
+ * The version of the OpenAPI document: 1.0.0
+ * 
+ *
+ * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
+ * https://openapi-generator.tech
+ * Do not edit the class manually.
+ */
+
+
+export interface LoginCheckPost200Response { 
+    readonly token: string;
+}
+

matsen-tool/src/app/core/api/v1/model/loginCheckPostRequest.ts

@@ -0,0 +1,18 @@
+/**
+ * Matsen API Platform
+ * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
+ *
+ * The version of the OpenAPI document: 1.0.0
+ * 
+ *
+ * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
+ * https://openapi-generator.tech
+ * Do not edit the class manually.
+ */
+
+
+export interface LoginCheckPostRequest { 
+    email: string;
+    password: string;
+}
+

matsen-tool/src/app/core/api/v1/model/models.ts

@@ -7,6 +7,8 @@ export * from './apiPostsGetCollection200ResponseHydraSearchHydraMappingInner';
 export * from './apiPostsGetCollection200ResponseHydraView';
 export * from './apiUsersGetCollection200Response';
 export * from './apiUsersGetCollection200Response1';
+export * from './loginCheckPost200Response';
+export * from './loginCheckPostRequest';
 export * from './post';
 export * from './postJsonhal';
 export * from './postJsonhalLinks';

matsen-tool/src/app/home/home.component.html

@@ -99,6 +99,12 @@
     </div>
 
 </div>
+<ul>
+    <li *ngFor="let user of users">
+        <h2>{{user.id}} - {{user.lastName}}</h2>
+        <p>{{user.email}}</p>
+    </li>
+</ul>
 <ul>
     <li *ngFor="let post of posts">
         <h2>{{post.id}} - {{post.owner}}</h2>

matsen-tool/src/app/home/home.component.ts

@@ -4,7 +4,7 @@ import { User } from '@app/_models';
 import { AccountService } from '@app/_services';
 import {MatCardModule} from "@angular/material/card";
 import {Subscription} from "rxjs";
-import {PostJsonld, PostService} from "@app/core/api/v1";
+import {PostJsonld, PostService, UserJsonld, UserService} from "@app/core/api/v1";
 
 @Component({
   templateUrl: 'home.component.html',
@@ -15,11 +15,21 @@ export class HomeComponent implements OnInit{
     protected postSub: Subscription;
     protected posts: Array<PostJsonld>;
 
-    constructor(private accountService: AccountService, private postService: PostService) {
+    protected usersSub: Subscription;
+    protected users: Array<UserJsonld>;
+
+    constructor(
+        private accountService: AccountService,
+        private postService: PostService,
+        private userService: UserService
+    ) {
         this.user = this.accountService.userValue;
         // this.accountService.user.subscribe(x => this.user = x);
         this.postSub = new Subscription();
         this.posts = [];
+
+        this.usersSub = new Subscription();
+        this.users = [];
     }
 
     ngOnInit(): void {
@@ -29,5 +39,10 @@ export class HomeComponent implements OnInit{
             }
         );
 
+        this.usersSub = this.userService.usersGetCollection().subscribe(
+            data => {
+                this.users = data["hydra:member"];
+            }
+        );
     }
 }

matsen-tool/src/app/users/list.component.ts

@@ -14,15 +14,12 @@ export class ListComponent implements OnInit {
     constructor(private userService: UserService) {
         this.usersSub = new Subscription();
         this.users = [];
-        console.log('sdaaadsds');
     }
 
     ngOnInit() {
         this.usersSub = this.userService.usersGetCollection().subscribe(
           data => {
-              console.log('sdaaadsds2332232332');
               this.users = data["hydra:member"];
-              console.log(data);
           }
         );
         // this.accountService.getAll()