Scribd
Upload
1 views

ass2c code

The document contains an Angular component for a registration form, including fields for name, address, contact, email, and password. Upon clicking the 'Register' button, the entered values are displayed on the page. The component utilizes two files: app.component.html for the template and app.component.ts for the logic.

Uploaded by

jakhuranusrat
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
1 views

ass2c code

The document contains an Angular component for a registration form, including fields for name, address, contact, email, and password. Upon clicking the 'Register' button, the entered values are displayed on the page. The component utilizes two files: app.component.html for the template and app.component.ts for the logic.

Uploaded by

jakhuranusrat
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2

app.component.

html

<h1>{{title}}</h1>

<div class="input">
<input type="text" #name placeholder="Enter Your Name" name="Name"><br>
<input type="text" #address placeholder="Enter Your Address"
name="Address"><br>
<input type="text" #contact placeholder="Enter Your Contact"
name="Contact"><br>
<input type="email" #email placeholder="Enter Your Email" name="Email"><br>
<input type="password" #password placeholder="Enter Password"
name="Password"><br>

<button (click)="getValue(name.value, address.value, contact.value,


email.value)">Register</button>
</div>

<div class="data">
<h1>Your Registered Data</h1>
<p>Name:{{displayname}}</p>
<p>Address:{{displayaddress}}</p>
<p>Contact:{{displaycontact}}</p>
<p>Email:{{displayemail}}</p>
</div>
app.component.ts
import { Component } from '@angular/core';
import { RouterOutlet } from '@angular/router';

@Component({
selector: 'app-root',
imports: [RouterOutlet],
templateUrl: './app.component.html',
styleUrl: './app.component.css'
})
export class AppComponent {
title = 'Registration Form';

displayname=' ';
displayaddress=' ';
displaycontact=' ';
displayemail=' ';

getValue(name:string, address:string, contact:string, email:string)


{
this.displayname=name;
this.displayaddress=address;
this.displaycontact=contact;
this.displayemail=email;

}
}

You might also like