打字稿:onChange事件计算

时间:2019-04-10 12:18:50

标签: angular typescript angular6

更改人数后如何获得总票价?

html代码:

<div class="row">
    <div class="col-md-6">
        <label for="person">Person</label>
        <div class="form-group">
            <input type="number" class="form-control" formControlName="person" id="input" (change)="countPrice($event)">

        </div>
    </div>

<div class="row">
    <div class="col-md-6">
        <label for="price">Price</label>
        <div class="form-group">
            <input type="number" class="form-control" id="output" formControlName="price" (change)="countPrice($event)">>
        </div>
    </div>
</div>

打字稿代码:

onDestination(eve) {
  this.http.post(environment.api_url + `/admin/get_price`, {

    "from_city": this.r.from_city.value,
    "to_city": this.r.to_city.value,

  }).subscribe(data => {
    console.log(data);
    this.price = data['data']['price'];
    console.log(this.price);
    this.bookingForm.patchValue({
      'price': this.price
    });
  })
}
countPrice(event) {

}

我想显示总价。通过与总人数相乘。我不知道如何从变更事件中获取价格。请有人帮我解决这个问题。

1 个答案:

答案 0 :(得分:0)

听起来valueChanges可能会救出来。

this.bookingForm.get('person').valueChanges.subscribe(num => this.countPrice(num));

然后,countPrice()可以实现并返回计算:

countPrice(totalPeople: number): number {
    return this.price * totalPeople;
}

https://angular.io/guide/reactive-forms#managing-control-values