Как инициализировать "настройки" на пустом узле Firebase в Polymer 2.x, используя firebase-документ?

Question

Я хочу реализовать <firebase-document> получить и применить пользовательские настройки. Я использую эту страницу в качестве руководства.

Когда я загружаю страницу без данных на /users/{{userId}}/settings узел в моей базе, я ожидаю увидеть объект { new: 'initial', j: 5, o: 'N' }) загружен там. Тем не менее, я на самом деле не вижу изменений в узле в моей базе данных.

Что я делаю неправильно и как я могу достичь желаемого поведения?

settings.html

<firebase-document
  path="/users/{{userId}}/settings"
  data="{{data}}">
</firebase-document>

<script>
Polymer({
  properties: {
    uid: String,
    data: {
      type: Object,
      observer: 'dataChanged'
    }
  },

  dataChanged: function (newData, oldData) {
    // if settings have not been set yet, initialize with initial value
    if(!newData && !oldData){
      this.set('data', { new: 'initial', j: 5, o: 'N' });
    }
  }
});
</script>

Редактировать: Отвечая на вопросы комментарием @HakanC:

Есть ли {{userId}} have a value when executed?

Да.

Is there data at the path /users/{{userId}}/settings?

Нет нет /settings node when the user first logs in. But I do have code that successfully creates a node at /users/{{userId}}, And that node is present when this element executes its script.

Console log whether you arrive this.set линия.

I do arrive there—multiple times. The first time, the logged value of data не определено The second time, the logged value of data является {},

Answer 1

Как вы упомянули выше, что в пути нет данных, вам нужно изменить условия. Что-то вроде:

if(newData === undefined){

вместо;

if(!newData && !oldData){

РЕДАКТИРОВАТЬ:

static get properties() { return { 
            uid: String,
            data:{
               type:Object,
               value() {return{}; }
              }
            }
          }
      static get observers() { return [ 'dataChanged(data)' ]} 


            constructor() {
              super();
            }

            ready() {
                super.ready();
                setTimeout(()=> {
                  this.set('data', undefined); //Retrieving data async from firebase.           
                },500)
            }

    dataChanged(data) {
    // if data has not been set then, initialize with new value
      console.log(data);
      if(!data){
        this.set('data', { new: 'initial', j: 5, o: 'N' });
      }
    }     

DEMO