Tutusfunny

In this tutorials will teach How to add two numbers in Angular.

First you have to add the FormsModule inside the imports.

Create the new Components addnumbers

addnum.components.html

<form>

    <h1>Add Two Numbers</h1>

<div>
  <label >Number 1</label>
  <input type = "text"  name="num1" [(ngModel)] = "num1" class="form-control"  placeholder="Enter Num 1">

</div>

<div>
    <label >Number 2</label>
    <input type = "text"  name="num2"  [(ngModel)] = "num2" class="form-control"  placeholder="Enter Num 2">
  
  </div>
  <div >
    <label >Total</label>
    <input  class="form-control"  placeholder="Total" value="{{ result }}"> 

  </div>

<button  (click)="Total()" class="btn btn-primary mt-4">Submit</button>


</form>

addnum.components.ts

Full code on the

addnum.components.ts

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

@Component({
  selector: 'app-addnum',
  templateUrl: './addnum.component.html',
  styleUrls: ['./addnum.component.scss']
})
export class AddnumComponent implements OnInit {

num1:string = '';
num2:string = '';
result:number=0;


Total()
{
  this.result = parseInt(this.num1) + parseInt(this.num2);
}

  constructor() { }

  ngOnInit(): void {
  }

}

i have attached the video link below. which will do this tutorials step by step