我制作了角度为7的计算器应用程序,我想计算加,减,乘,除方法。我具有在输入中显示数字按钮的功能,但是当我求和或进行任何计算方法时,需要通过单击结果按钮在输入中显示结果。
buttons.component.ts
import { Component, Input} from '@angular/core';
@Component({
selector: 'app-buttons',
templateUrl: './buttons.component.html',
styleUrls: ['./buttons.component.css']
})
export class ButtonsComponent {
@Input() value :string;
result:string='';
setValue(value: string) {
this.value = value;
}
addition(){
this.result= this.value + this.value;
}
buttons.component.html
<div class="calculator">
<div><span> </span></div>
<div>
<label>
<input [(ngModel]="value" placeholder="0"/>
</label>
</div>
<div class="calculator-buttons" ></div>
<div>
<button type="button" class="btn btn-calc clear" (click)="clear()"> AC </button>
<button type="button" class="btn btn-calc" (click)="delete()" > < </button>
<button type="button" class="btn btn-calc operator" (click)="div()"> / </button>
</div>
<div>
<button type="button" class="btn btn-calc" (click)="setValue()" value="7" >7</button>
<button type="button" class="btn btn-calc" (click)="setValue()" value="8">8</button>
<button type="button" class="btn btn-calc" (click)="setValue()" value="9">{{ 9}}</button>
<button type="button" class="btn btn-calc operator" (click)="multiply()">*</button>
</div>
<div>
<button type="button" class="btn btn-calc" (click)="setValue()" value="4">4</button>
<button type="button" class="btn btn-calc" (click)="setValue()" value="5">5</button>
<button type="button" class="btn btn-calc" (click)="setValue()" value="6">6</button>
<button type="button"class="btn btn-calc operator" (click)="sub()">-</button>
</div>
<div>
<button type="button" class="btn btn-calc" (click)="setValue()" value="1">1</button>
<button type="button" class="btn btn-calc" (click)="setValue()" value="2">2</button>
<button type="button" class="btn btn-calc" (click)="setValue()" value="3">3</button>
<button type="button" class="btn btn-calc operator" (click)="addition()">+</button>
</div>
<div>
<button type="button" class="btn btn-calc zero" (click)="setValue()" value="0">0</button>
<button type="button" class="btn btn-calc"(click)="dot()">.</button>
<button type="button" class="btn btn-calc operator"(click)="result($event)">=</button>
</div>
</div>