2015-11-20 49 views
1

我試圖讓漸進渲染在Marko和Koajs中工作。Marko和Koajs:爲什麼我的異步片段渲染不起作用?

首先,我使用request-promise模塊爲JSON數據饋送做出承諾。

rp = require('request-promise') 

function getDataFeed() { 

    var url = "http://api.dronestre.am/data"; 
    var options = { 
     url: url, 
     headers: { 'User-Agent': 'request' }, 
    }; 

    rp(options).then(function(result) { 

     var info = JSON.parse(result); 
     return info.strike; 
    }); 
}; 

然後我用KOA路由器和馬爾科加載,其中進料進去的數據

// router method to serve first visualization 
router.get('/first', function *() { 

    let data = { 
     strikes : getDataFeed() 
    }; 

    this.body = marko.load('./views/first.marko').stream(data); 
    this.type = "text/html"; 
}) 

和模板最後,在我的模板,我使用異步片段,表明部分的頁面應該異步加載:

<async-fragment data-provider='data.strikes' var='strikes' client-reorder='true'> 
    <async-fragment-placeholder> 
     <p>Loading...</p> 
    </async-fragment-placeholder> 
    <for each="strike in strikes"> 
     <tr> 
      <td>${strike.number}</td> 
      <td>${strike.country}</td> 
      <td>${strike.date}</td> 
      <td>${strike.narrative}</td> 
      <td>${strike.town}</td> 
      <td>${strike.deaths}</td> 
      <td>${strike.target}</td> 
      <td>${strike.lat}</td> 
      <td>${strike.lon}</td> 
     </tr> 
    </for> 
</async-fragment> 

不幸的是,沒有任何東西在異步片段塊中加載。甚至沒有佔位符。

如何獲取佔位符以顯示數據,然後將數據置於模板中?

回答

1

問題解決!我需要在getDataFeed()

液返還承諾的功能:

rp = require('request-promise') 

function getDataFeed() { 

    var url = "http://api.dronestre.am/data"; 
    var options = { 
     url: url, 
     headers: { 'User-Agent': 'request' }, 
    }; 

    return rp(options).then(function(result) { 

     var info = JSON.parse(result); 
     return info.strike; 
    }); 
}; 
+0

高興你理解了它!請隨時加入我們的Gitter:gitter.im/marko-js/marko –