HTML Forms, AngularJS Examples, and TypeScript Login

Posted on Mar 30, 2025 in Computers

HTML Form

Name:

Date of Birth:

Age:



Email:



Website:



Sign Up

AngularJS Examples

Expression Example

10 + 5 = {{ 10 + 5 }}

String Interpolation

The Complete name is: {{ firstName + ‘ ‘ + lastName }}

Data Binding

Total amount rupees:

Object Binding

The First name is {{ person.firstName }}

Array Binding

The second result is

AngularJS Modules and Controllers

{{ firstName + ‘ ‘ + lastName }}

AngularJS Directives

Cost Calculator

Quantity: Price:

Total in rupees: {{quantity * price}}

ng-model Directive

Name:

Use the ng-model directive to bind the value of the input field to a property made in the controller.

Two-Way Data Binding

Name:

{{firstname}}

Change the name inside the input field, and the model data will change automatically, and therefore also the header will change its value.

Controllers Example

First Name:
Last Name:
Full Name: {{firstName + ‘ ‘ + lastName}}

AngularJS Feedback Form

Feedback Form

Name:
Comments:
I agree to the terms and conditions
Feedback Summary

Name: {{feedback.name || ‘Not provided’}}

Comments: {{feedback.comments || ‘No comments’}}

Agreed to Terms: {{feedback.agreeTerms ? ‘Yes’ : ‘No’}}

AngularJS Online Store Products

Online Store Products

  • {{product.name}}
Add Product

TypeScript Example

User Login


interface User {
  username: string;
  password: string;
}

function login(user: User): string {
  if (user.username === "admin" && user.password === "password123") {
    return "Login successful";
  } else {
    return "Login failed";
  }
}

const validUser: User = {
  username: "admin",
  password: "password123"
};

const invalidUser: User = {
  username: "user",
  password: "wrongpassword"
};

console.log(login(validUser));  // Output: "Login successful"
console.log(login(invalidUser)); // Output: "Login failed"