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) 
       }, 

{}}のために{[]]角括弧を使用しようとしています。マップ、結果、および座標は出力ラベルでは空です。それはサンフランシスコとの地図を示していますが、私が入力にテキストを印刷しようとすると、それは検索したくありません。コンソールのエラーではありません。私はこれについてgoogleからチュートリアルビデオを見ましたが、古いバージョンのPolymerがあり、要素ヘッド内の{{$ .element.attribute}}のような多くのものは機能しません（ '$'は何か分かりません） 。私は公式のチュートリアルから理解できないので、[[]]と{{}}の最大の違いは何かを説明することができますか？

は解決：それを解決するために、私はプロパティで、ダイアログの内側から新しいテンプレートにソースを置く必要があります= "DOM-バインドされ

 <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. はい、google-map-searchのresultsが上方に伝播できず、ラベルが空であることを意味するので、括弧は[[]]の括弧で囲まれています。結果を変更する必要がありますs = [[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>は、私もあなたの検索結果から、デフォルト値（あるいは単にそのためにあなたのgoogle-map要素の属性を使用してください）または戻り値のいずれかの計算プロパティにlatとlonを変更します<label>coords:[[ results.lat ]], [[ results.lon ]]</label>
4. に変更する必要があります。