ionic 4如何在不刷新的情况下在模态内显示更新的数据

Question

我正在将数据更新到数据库中，但如果不刷新就无法显示更新后的数据。场景是用户使用 select 更改变量 'quantity'，然后这个数量在数据库中成功更新，现在我想显示价格

p.price * p.quantity

没有刷新页面，因为这是在模式中发生的。谁能帮我实现这个目标。谢谢

html

 <ion-list>
  <ion-item *ngFor="let p of cart ;  let i=index" class="ion-text-wrap">

      <ion-grid>
        <ion-row class="ion-align-items-center">

          <ion-col size ="6">
            <ion-img class="img" [src]='p.product.image_url'></ion-img>
          </ion-col>


          <ion-col size ="6">

            <ion-row size="3">
              <b>{{p.product.name}}</b>

            </ion-row>

            <br>

            <ion-row>

              <select style="max-width:50%;" (change)="onChange($event.target.value, p) " [value]=p.quantity  > 

                <option  [ngValue] = "q" *ngFor ="let q of quantity" >{{q}}</option>
                </select>
                &nbsp; {{p.product.unit}}


          </ion-row>

            <br>
            <ion-row class="ion-text-end"> 
              {{ p.price * p.quantity | currency:'INR' }}


            </ion-row>
      </ion-item>
      </ion-list>

ts

onChange(new_quantity,object  ) {

    console.log("Quantity new " + new_quantity)
    console.log("price per kg "  + object.price)
    console.log("Quantity Old " + object.quantity)
    console.log("cart_id " + object.cart_id)


    let cart = {
      cart_id : object.cart_id,
      date : new Date,
      quantity : Number (new_quantity),
      price : object.price,
      user_id : object.user_id,
      product_id : object.product_id
    }

    console.log(cart)

    this.cartService.updatecartItem(object.cart_id, cart).subscribe(data =>{
      console.log(data)
    })
  }

Answer 1

在行内使用 span 或 p 并具有 [innerHTML] 绑定...检查此线程作为示例，注意插值不是每次都执行。 .. 每次值更改时都会执行输入绑定，因此它应该在您设置后更新

Answer 2

作为 ionic & angular 的异步行为，我只是将 object.quantity 更改为新的数量，并且 angular 在后台处理所有类似的事情

object.quantity = new_quantity;

ionic 4如何在不刷新的情况下在模态内显示更新的数据

ionic 4 how to display updated data inside modal without refresh

http

put

angular

ionic4