使用打字稿中的onclick事件显示算术运算

时间:2017-06-16 11:48:54

标签: angularjs typescript

这是我学习离子骨架的第一次尝试。我已经启动了一个项目,我想在其中输入两个数字作为输入,并使用onclick事件显示特定操作,如sum,square,division。 的 html的

<ion-content padding>
<div ng-app="">

    <p>First Number: <input type="number" [(ngModel)]="p"/> </p>

    <p>Second Number: <input type="number" [(ngModel)]="q" /> </p>

</div>
    <div>
    <button t (click)='onAdd();'>Sum</button>
    <button t (click)='onMul();'>Product</button>
    <button t (click)='onSquare();'>Square</button>
    <button t (click)='onDivide();'>Division</button>
</div>
</ion-content>

.TS

    export class HomePage {

p:number =0;

q:number =0;

  constructor(public navCtrl: NavController) {

}

onAdd(p:number,q:number){

console.log("sum={{ p + q }}")

}

 onMul(p:number,q:number){

console.log("mul={{ p * q }}");

}

onSquare(p:number,q:number){

console.log("square={{ p * p }},{{ q * q }}");

}

 onDivide(p:number,q:number){

console.log("divide={{ p / q }}");

}

}

单击按钮时不显示输出。我还导入了角度库...请你帮忙..?

1 个答案:

答案 0 :(得分:0)

在html下面的代码

DECLARE @data TABLE ( ID INT , [Year] INT);

INSERT INTO @data [Year] VALUES (1980);

SELECT ID, [Year] FROM @data;

然后在component.ts上执行此操作

  <p>First Number: <input type="number" [(ngModel)]="p"/> </p>
  <p>Second Number: <input type="number" [(ngModel)]="q" /> </p>
  <button (click)='onAdd()'>Sum</button>
  <p>{{ result }}</p>