Polymer，如何在渲染其他元素之前等待core-ajax完成？

更新：這裏有這種情況的文檔：Conditional templates use the if attribute to conditionally create a template instance.Polymer，如何在渲染其他元素之前等待core-ajax完成？

這個程序，plnkr.co，應做到以下幾點：

使用核心AJAX組件從DB獲得project_location（JSON在這個例子中）
使用谷歌地圖組件來顯示帶有標記的地圖
當用戶拖動了市場，使用核 - AJAX來保存新的位置到DB

問：如何讓谷歌地圖組件等待渲染，直到AJAX請求完成？

目前出現此錯誤：「在觀察者回調期間捕獲的異常：TypeError：緯度必須是數字」，我假設這是因爲google-map是在{{project_location}}啓動之前呈現的。

 <core-ajax id="ajax_get_location" 
     auto 
     url="project_location.json" 
     params='{"idProject":"{{idProject}}"}' 
     on-core-response="{{locationLoaded}}" 
     handleAs="json" 
     response = "{{project_location}}"></core-ajax> 



    <google-map id="project_location_map" 
      zoom="{{project_location.location_map_zoom}}" 
      fitToMarkers> 
     <google-map-marker 
        latitude ="{{project_location.location_map_marker_latitude | toFixed(2)}}" 
        longitude ="{{project_location.location_map_marker_longitude | toFixed(2)}}" 
        title  ="{{project_title}}" 
        draggable ="true" 
        > 
     {{project_title}} 
     </google-map-marker></google-map>

來源

2014-11-23 Goce Ribeski

包裹等元素，我認爲最乾淨的方法是不去想這與<core-ajax>一個時間問題。基本上，問題在於，除非project_location的值存在，否則您不希望在頁面上包含<google-map>元素。在你的代碼片段中，project_location的值來自<core-ajax>，但你可以很容易地想象一個不同的實現，其中project_location通過其他方式填充。

所以，如果你想這樣的說法，什麼是有意義是包裹<google-map>在檢查的project_location值的條件模板：

<template if="{{project_location}}"> 
    <google-map> 
    ... 
    </google-map> 
<template>

來源

2014-11-24 00:30:56

確定嗎？我試了一下，發現不管你使用if還是不影響結果。它出現在你得到迴應之後**。 – Melkor 2014-12-13 11:53:58

可以當核心axax已完成對模型改變的值，並用<template if="{{ajaxHasFinished}}">...</templ<te>

來源

2014-11-23 22:03:25

除了其他人所說，一個又一個方法在教程https://www.polymer-project.org/docs/start/tutorial/step-3.html中演示，其中您創建另一個元素來執行ajax事物，並將其用於原始元素中。數據傳輸是通過屬性和數據綁定來實現的。

我認爲這是一種更好的方式，因爲您將數據顯示與數據提取分開，使其在軟件工程中看起來更好。

P.S.我試過其他答案，但我發現無論您是否使用if條件都沒有關係。

來源

2014-12-13 11:49:21 Melkor

無論您是直接使用core-ajax還是通過其他元素間接使用，模板中的if條件都是必需的。有時，AJAX響應可能會比其他元素的渲染速度更快，在這種情況下，您將不會注意到問題 - 其他元素的數據將在那裏顯示。也許這在你的測試中發生了。 – 2014-12-14 09:49:21

@goceribeski但是在我的測試中，我讓我的後端腳本休眠了2秒，並沒有使用'if'條件，並且模板仍然會等待2秒鐘出現。 – Melkor 2014-12-14 15:42:23

Polymer，如何在渲染其他元素之前等待core-ajax完成？

回答

相關問題