asynchronous - Polymer と Firebase: パスの変更動的に

Question

私はいくつかのデータを取得するコンポーネントを持っています。内部にバインディングがあるため、パスは動的です。

次に、パスを動的に変更するリンクがいくつかあります。それに応じてデータのリストが更新されることを期待しています。

ページを最初にロードしたときは問題なく動作しますが、リンクをクリックしてパスを更新する (したがって新しいデータを取得する) と、何も返されません。

オブザーバーで何が起こっているかを確認したところ、パスを更新するたびにデータが 2 回更新されているように見えます。最初に期待する実際のデータが返され、次に空の配列が返されます。

コンポーネントは次のとおりです。

<dom-module id="test-one">

  <template>

    <firebase-query app-name="main" path="/templates/[[template]]" data="{{items}}"></firebase-query>

    <a on-tap="changeTemplate" data-template="template1">Template 1</a><br />
    <a on-tap="changeTemplate" data-template="template2">Template 2</a><br />

    <p>Current template is [[template]]</p>

    <template is="dom-repeat" items="{{items}}" as="item">
      [[item.ref]] - [[item.description]]<br />
    </template>

  </template>

  <script>
    Polymer({
      is: 'test-one',
      properties: {
        items: {type: Array, observer: "dataChanged"},
        template: {type: String, value: "template1"},
      },
      dataChanged: function(newData, oldData) {
        console.log(newData);
      },
      changeTemplate: function(e) {
        elm = e.currentTarget;
        template = elm.getAttribute("data-template");
        console.log("link has been clicked, we're changing to "+template);
        this.set("template", template);
      }
    });
  </script>

</dom-module>

リンクの 1 つをクリックすると、コンソールに次のように表示されます。

非同期の魔術が行われているようです - これを解決する方法はありますか?