我是 angular 的初学者。我想添加两个数字来计算总数。当我尝试这样做时,我收到错误无法编译。到目前为止我尝试过的内容附在下面。
table.component.html
<form>
<label >Num 1</label>
<input type="text" class="form-control" id="num1" [(ngModel)]="num1" name="num1" placeholder="Enter email">
<label >Num 2</label>
<input type="text" class="form-control" id="num2" [(ngModel)]="num2" name="num2" placeholder="Enter email">
<label>{{ parseFloat(num1) + parseFloat(num2) }}</label>
<button (click)="myClickFunction" type="button" class="btn btn-danger">Danger</button>
</form>
table.component.js
export class TableComponent implements OnInit {
num1 : number = 0;
num2 : number= 0;
答案 0 :(得分:0)
<form>
<label >Num 1</label>
<input type="text" class="form-control" id="num1" [(ngModel)]="num1" name="num1" placeholder="Enter email">
<label >Num 2</label>
<input type="text" class="form-control" id="num2" [(ngModel)]="num2" name="num2" placeholder="Enter email">
<label>{{ (+num1) + (+num2) }}</label> // Replace parseFloat with `+`
<button (click)="myClickFunction()" type="button" class="btn btn-danger">Danger</button> // fill the missing `()`
</form>
您可以看到现场示例 here。
*PS:在 Angular 12 中,为了避免 NaN
,您还可以这样做:
<label>{{ (+num1 ?? 0) + (+num2 ?? 0) }}</label>
在以前的版本中,您可以这样编写:
<label>{{ (+num1 ? +num1 : 0) + (+num2 ? +num2 : 0) }}</label>
*