Google Polymer: google-map-search не работает

Question

  <paper-dialog id="post" entry-animation="scale-up-animation" exit-animation="fade-out-animation"> 
       <div class="find-area"> 
        <paper-textarea on-input="find" id="find_textarea" class="find-place-text" label="Find your place" maxlength="250"></paper-textarea> 
       </div> 
       <div class="map-area"> 
        <google-map id="[[map]]" 
           api-key="000000000myapi000000" 
          latitude="[[lat]]" 
          longitude="[[lon]]" 
          fit-to-markers> 
        </google-map> 
        <google-map-search id="google_search" 
             globalSearch="true" 
             map="[[map]]" 
             results="[[results]]"> 
        </google-map-search> 
       </div> 
       <paper-button on-tap="[[upload]]">Accept</paper-button> 
       <label>coords:[[ results::lat ]], [[ results::lon ]]</label> 
       <label>query:[[ query ]]</label> 
       <label>map:[[ map ]]</label> 
       <label>results:[[results]]</label> 
      </paper-dialog> 
<script> 
      function _showPosition(position) { 
      try { 
       x.latitude = position.coords.latitude; 
       x.longitude = position.coords.longitude; 
      }catch (err){ 
       alert(err+'; position:'+position) 
      } 

     } 
     function showError(error) { 
      alert('error:'+ error) 
     }*/ 
     function _submit(event) { 
      Polymer.dom(event).localTarget.parentElement.submit(); 
     } 
     Polymer({ 
       is: 'profile-new-post', 
       properties: { 
        enable : { 
         type: Boolean, 
         value: true 
        }, 
        lat : { 
         value : 37.77493 
        }, 
        lon : { 
         value : -122.41942 
        }, 
        query : { 
         type : String, 
         value : "" 
        }, 
        results : { 
         type : Array 
        }, 
        map : { 
         type : Object 
        } 
       }, 
       func : function (e) { 
        this.map = this.$.map; 
        post.open(); 
       }, 
       find : function (e) { 
        this.$.google_search.query = this.$.find_textarea.value; 
        this.query = this.$.google_search.query; 
        this.$.google_search.search(); 
        this.lat = this.$.google_search.results.latitude; 
        this.lon = this.$.google_search.results.longitude; 
        //alert(this.$.google_search.results.latitude + '; ' + this.$.google_search.results.longitude) 
       }, 

Я пытаюсь использовать [[]] скобки из-за использования django {{}}. Карта, результаты и координаты пустые на выходных таблицах. Он показывает карту с Сан-Франциско, но когда я пытаюсь напечатать текст во входном файле, он не хочет искать. Ошибки в консоли не являются. Я видел учебное видео из google об этом, но была старая версия Polymer, и многие вещи, такие как {{$ .element.atribute}} внутри элемента элемента, не работают (он не знает, что такое «$») , Может быть, кто-то может объяснить мне, какая разница между [[]] и {{}}, потому что я не могу понять это из официального учебника?

Решите: решить эту проблему, я должен поместить источник внутри диалогового окна для нового шаблона с имуществом = "дом-привязывать

 <p><paper-button raisedButton on-tap="upload">Upload</paper-button></p> 
     <paper-button id="dialogbutton" on-tap="func">Post</paper-button> 
     <paper-dialog id="post" entry-animation="scale-up-animation" exit-animation="fade-out-animation"> 
      <template is="dom-bind"> 
       <div class="find-area"> 
        <paper-input value="{{ input_query }}" on-input="find" id="find_textarea" class="find-place-text" label="Find your place" maxlength="250"></paper-input> 
       </div> 
       <div class="map-area"> 
        <google-map-search 
          id="google_search" 
          map="{{ map }}" 
          query="{{ input_query }}" 
          results="{{results}}" 
          on-google-map-search-results="searchingComplite"> 
         </google-map-search> 
         <google-map 
           map="{{map}}" 
           latitude="{{results[0}.latitude}}" 
           longitude="{{results[0}.longitude}}"> 
         </google-map> 
       </div> 
       <paper-button on-tap="upload">Accept</paper-button> 
       <label>coords:{{ lat }}, {{ lon }}</label> 
       <label>query:{{ query }}</label> 
       <label>map:{{ map }}</label> 
       <label>results:{{ results }}</label> 
      </template> 

Answer 1

Есть несколько вопросов здесь:.

1. Да, здесь есть проблемы с скобками [[]], потому что они обеспечивают одностороннюю привязку. Это означает, что results из google-map-search не может распространяться вверх и метки не заполнены. Вам нужно изменить результ ts = [[results]] до results={{results}}, чтобы включить двустороннее связывание
2. Для децилерирующих обработчиков событий вам не нужны никакие скобки. Итак, эта строка <paper-button on-tap="[[upload]]">Accept</paper-button> должна быть? <paper-button on-tap="upload">Accept</paper-button>
3. Чтобы получить доступ к дополнительным свойствам объекта, связанного с данными, вам необходимо использовать точечную нотацию (.). Эта линия <label>coords:[[ results::lat ]], [[ results::lon ]]</label> должна быть изменена на <label>coords:[[ results.lat ]], [[ results.lon ]]</label>
4. Я хотел бы также изменить lat и lon вычисленных свойства, либо значения по умолчанию возврата (в качестве альтернативы просто использовать атрибуты вашего google-map элемента для этого) или значения из результата поиска.