angular login page example

angular

Here is an example of a simple login page implemented using Angular:

<!-- login.component.html -->

<form #loginForm="ngForm" (ngSubmit)="login()">
    <label for="username">Username:</label>
    <input type="text" id="username" name="username" [(ngModel)]="username" required>
    <br>
    <label for="password">Password:</label>
    <input type="password" id="password" name="password" [(ngModel)]="password" required>
    <br>
    <button type="submit" [disabled]="!loginForm.form.valid">Log In</button>
</form>
// login.component.ts

import {Component} from '@angular/core';

@Component({
    selector: 'app-login',
    templateUrl: './login.component.html',
    styleUrls: ['./login.component.css']
})
export class LoginComponent {
    username: string;
    password: string;

    login() {
        // Perform login using the username and password
    }
}

This login page consists of a form with two input fields for the username and password, and a submit button. The [(ngModel)] directive is used to bind the input fields to the username and password properties of the component. The required attribute is used to specify that the fields are required.

The login() method is called when the form is submitted using the (ngSubmit) directive. This method can be used to perform the login by sending the username and password to the server for authentication.