firebasepolymer-2.xpaper-elementspolymerfire

Polymer Firebase Binding for Location


I've been trying to bind a location value to a "note" (as in the na-notes example in codelabs) via firebase. I'm using the paper-input-place, but have tried with several other elements to no avail. So far, this is what I have (corresponding to the na-note.html document):

<paper-input-place is="iron-input" bind-value="{{address}}" value="{{address}}" label="Address" api-key="key">

And then I have this on my na-editor.html:

<na-note id="note" title="{{note.title}}" location="{{note.place_id}}" price="{{note.price}}" rooms="{{note.rooms}}" beds="{{note.beds}}" baths="{{note.baths}}" editable></na-note>

I am thinking that it probably is a silly mistake, but I've been going at it for two days and I'm starting to loose my patience, so any help would be appreciated!

Thanks!


Solution

  • at above na-note element, note is an object retrieved from firebase. so, to this path, you will need to save location data of the note. So, when you received the proper data from paper-input-place element, you will need to save it to the note's path as a location. So, first retrive the address:

    <paper-input-place  hide-error place="{{place}}" api-key="[[apiKey]]"  on-place-changed="searchPlaceChanged" > </paper-input-place>
    

    ...

    searchPlaceChanged(p){
       console.log(p.detail.value); // You will need to see the place data, which you may like to save only some detail like: p.detail.value.formatted_address; 
       this.set('note.place', p.detail.value.formatted_address);
    }
    

    Asuming just abobe note object (at set operation) is firebase-document's two way binding retrived data that you just editing.