adapted and refined the implementation of the component

- Adapted the implementation to the project structure.
- Moved the HTML code in a separate file.

diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html
index 147cfc4..ae88858 100644 (file)
--- a/src/app/login/login.component.html
+++ b/src/app/login/login.component.html
@@ -1 +1,15 @@
-<p>login works!</p>
+<form (ngSubmit)="onSubmit()">
+  <label>
+    Username:
+    <input type="text" [(ngModel)]="username" name="username" required>
+  </label>
+  <br>
+  <label>
+    Password:
+    <input type="password" [(ngModel)]="password" name="password" required>
+  </label>
+  <br>
+  <button type="submit" [disabled]="isLoading">Login</button>
+</form>
+<div *ngIf="error">{{ error }}</div>
+<div *ngIf="token">Welcome, {{ username }}! Your token is {{ token }}</div>

diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts
index 30c71ee..a19edad 100644 (file)
--- a/src/app/login/login.component.ts
+++ b/src/app/login/login.component.ts
@@ -1,26 +1,13 @@
+import { Component } from '@angular/core';
 import { Store } from '@ngrx/store';
-import { login } from './store/login.actions';
-import { selectToken, selectError, selectIsLoading } from './store/login.selectors';
+import { login } from '../store/login.actions';
+import { selectToken, selectError, selectIsLoading } from '../store/login.selectors';
 
 @Component({
   selector: 'app-login',
-  template: `
-    <form (ngSubmit)="onSubmit()">
-      <label>
-        Username:
-        <input type="text" [(ngModel)]="username" name="username" required>
-      </label>
-      <br>
-      <label>
-        Password:
-        <input type="password" [(ngModel)]="password" name="password" required>
-      </label>
-      <br>
-      <button type="submit" [disabled]="isLoading">Login</button>
-    </form>
-    <div *ngIf="error">{{ error }}</div>
-    <div *ngIf="token">Welcome, {{ username }}! Your token is {{ token }}</div>
-  `
+  imports: [],
+  templateUrl: './login.component.html',
+  styleUrl: './login.component.less'
 })
 export class LoginComponent {
   username = '';