Polymer 2. 在 iron-ajax 响应后更改其他 html-page（iron-page）上的值

Question

当我使用 iron-page 更改页面时，我想在我的新页面上设置值。属性具有正确的值，但 html 未正确更新。

这是我的页面。当我切换到此页面时，订单确认值是正确的值。 <td> 中的值仍然是空字符串。

<dom-module id="pn-bookpickup-confirmation">
<template>
 <style include="main-styles">
</style>
<div class="confirmation-wrapper">
  <h3 class="center-header">{{localize("thankYou")}}</h3>
   <table>
     <tr>
      <td>{{localize("orderReference")}}:</td>
      <td class="font-weight-bold" id="orederRefId">{{orderconfirmation.orderreference}}</td>
    </tr>
  </table>
</div>
</template>
 <script>
 Polymer({
  is: "pn-bookpickup-confirmation",
  behaviors: [
    PnLocalizeBehavior
  ],
  properties: {
    language: {
      type: String,
      notify: true
    },
    orderconfirmation: {
      type: Object,
      notify: true,
      value: function () {
        return {
          pickuptime: "",
          orderreference: ""
        }
      }
     },
    },
   });
  </script>
 </dom-module>

在我的主页上，我在设置正确的值后切换到另一个页面：

  handleResponse: function (data) {
    console.log(data.detail.response);
    var response = data.detail.response.Item;

    this.orderconfirmation.orderreference = response.order.orderReference;
    this.orderconfirmation.pickuptime = response.order.operationDate; 
    this.selectedpage = "booking-confirmation";
  },

所以我想在保留数据时更改 HTML 中的订单确认值。任何人都知道我应该如何处理这个？谢谢

Answer 1

您提供的信息我建议尝试：this.set this.set('orderconfirmation.orderreference', response.order.orderReference); this.set('orderconfirmation.pickuptime ', response.order.operationDate);

使用 set 方法对子属性进行可观察到的更改。

https://www.polymer-project.org/2.0/docs/devguide/model-data

Polymer 2. 在 iron-ajax 响应后更改其他 html-page（iron-page）上的值

Polymer 2. Change value on other html-page (iron-page) after iron-ajax response

polymer-2.x