如何在模型更改时更新聚合物组件

Question

我有一个简单的Polymer组件，它从外部URL获取数据，在本例中是一个json占位符，将来这将从API中消耗。

我想要做的是在模型更新时更新显示的数据，如果来自API响应的公开数据发生变化，我需要立即将其反映到HTML（可能使用网络套接字，在我的情况下使用信号R）。

<dom-module id="ajax-test">
<template>

    <!-- GETS THE DATA FROM A SOURCE -->
    <iron-ajax auto
               url="https://jsonplaceholder.typicode.com/users"
               handle-as="json"
               last-response="{{ajaxResponse}}">
    </iron-ajax>

    <table class="tg">
        <caption><span>USERS</span></caption>
        <template is="dom-repeat" items="[[ajaxResponse]]">
            <tr>
                <th class="tg-yw4l">[[item.name]]</th>
                <th class="tg-yw4l">[[item.username]]</th>
                <th class="tg-yw4l">[[item.email]]</th>
                <th class="tg-yw4l">[[item.address.street]] [[item.address.suite]] </th>
            </tr>
        </template>

    </table>

    <!-- SHOW THE FETCHED DATA -->
    <br />
    <pre>[[json(ajaxResponse)]]</pre>

</template>
<script>
    class AjaxTest extends Polymer.Element {
        static get is() { return 'ajax-test'; }

        static get properties() {
            return {
                prop1: {
                    type: String,
                    value: "bar"
                }
            }
        }

        json(obj) {
            return JSON.stringify(obj, null, 2);
        }
    }
    customElements.define(AjaxTest.is, AjaxTest);

</script>