function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Shruthi MN 32Shruthi MN 32 

VS Code Simple interest calculator error

I have created a SI calculator using Lightning Web Component

but the result is not getting displyed can anyone help me with the same and each time I enter values I am getting below error.

I have reffered this use case from below video
https://www.youtube.com/watch?v=f0OFW2EqZow&list=PLdYQMTciVWO9dJAafGxS1HuZy4wx6AxAW&index=13

User-added imageUser-added image

HTML

<template>
    <lightning-card title="Simple Interest Cal"></lightning-card>
    
        <lightning-layout multiple-rows></lightning-layout>
            <lightning-layout-item size= "12" padding = "around-medium" > </lightning-layout-item>
<lightning-input type="number" label = "Enter Principle" onchange= {principalChangeHandler}>
    </lightning-input>
   
    <lightning-layout-item size= "12" padding = "around-medium" > </lightning-layout-item>
    <lightning-input type="numer" label = "Enter No Of Years" onchange= {timechangehandler}>
    </lightning-input>
   
    <lightning-layout-item size= "12" padding = "around-medium" > </lightning-layout-item>
    <lightning-input type="number" label = "Enter Rate Of Interest" onchange= {ratechangehandler}>
    </lightning-input>
   
    <lightning-layout-item size= "12" padding = "around-medium" ></lightning-layout-item>
    <lightning-button label= "Calculate SI" icon-position = "centre" onclick= {calculateSIHandler} >
    </lightning-button>

<lightning-layout-item size= "12" padding = "around-medium" > </lightning-layout-item>
    <lightning-formatted-text value= {currentoutput}  ></lightning-formatted-text>
   
        
</template>

JS

import  { LightningElement, track } from 'lwc';

export default class Simpleinterstcal extends LightningElement {
   
@track currentOutput; 
principal;
rateofinterest;
numberofyears;
principalChangeHandler (event)
{
this.principal = parseint(event.target.value);
}
timechangehandler (event)
{
this.noOfyears = parseint(event.target.value);
}
ratechangehandler (event)
{
this.noOfyears = parseint(event.target.value);
}
calculateSIHandler (event)
{
this.currentOutput = 'Simple Interest is :' + (this.principal*this.rateofinterest*this.numberofyears)/100;
}
}

XML
 <?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>48.0</apiVersion>
    <isExposed>true</isExposed>
<targets>
    <target>lightning__AppPage</target>
    <target>lightning__RecordPage</target>
    <target>lightning__HomePage</target>
</targets>
</LightningComponentBundle>


 
SarvaniSarvani
Hi Shruthi,

Please try with below JS code:
 
import  { LightningElement, track } from 'lwc';

export default class Simpleinterstcal extends LightningElement {
   
@track currentOutput; 
principal;
rateofinterest;
noOfyears;

principalChangeHandler (event)
{
this.principal = parseInt(event.target.value,10);
}
timechangehandler (event)
{
this.noOfyears = parseInt(event.target.value,10);
}
ratechangehandler (event)
{
this.rateofinterest = parseInt(event.target.value,10);
}
calculateSIHandler()
{
this.currentOutput =  'Simple Interest is :' +parseFloat((this.principal*this.rateofinterest*this.noOfyears)/100);
}
}
Hope this helps! Please mark as best if it solves your issue.

Thanks
 
Shruthi MN 32Shruthi MN 32
It si still not working