rent-list.component.html

rent-list.component.html

<div class="row">
    <div class="input-field col s6">
        <input [(ngModel)]="meterCurr" name="meterCurr" type="number">
        <label class="active" for="meterCurr">meter curr</label>
    </div>
    <div class="input-field col s6">
        <input [(ngModel)]="paid" name="paid" type="number">
        <label class="active" for="paid">paid</label>
    </div>
    <div class="input-field col s6">
        <input [(ngModel)]="extraCost" name="extraCost" type="number">
        <label class="active" for="extraCost">extra cost</label>
    </div>
    <div class="col s12 m12">
        <p>curr: {{meterCurr}}</p>
        <p>prev: {{meterPrev}}</p>
        <p>paid: {{paid}}</p>
        <p>extras: {{extraCost}}</p>
        <p>Total: {{total}}</p>
        <p>Due: {{total-paid}}</p>
        <button class="btn waves-effect waves-light" type="submit" name="action" (click)="submit()">Submit</button>
    </div>
</div>