與流星

Question

HTTP API請求填入HTML表我有一個表

<table> 
<thead> 
    <tr> 
    <th>Year</th> 
    <th>Value</th> 
    </tr> 
</thead> 
<tbody> 
    <tr> 
    <td>1990</td> 
    <td>-</td> 
    </tr> 
    ... 
</tbody> 
</table> 

，我想打一個GET請求世界銀行API在此表中填寫的值。

我的GET請求是流星方法

Meteor.methods({ 
    getData: function() { 
    try { 
     const url = 'http://api.worldbank.org/countries/br/indicators/NY.GDP.MKTP.CD?date=1990:2000&format=json'; 
     const request = HTTP.get(url); 
     return request; 
    } catch (e) { 
     console.log(e); 
     return false; 
    } 
    }, 
}); 

，我打電話給我的方法從客戶端

Meteor.call('getData', function(error, result) { 
    console.log(result); 
}); 

所以我在控制檯中的值，但我想更換-在正確的值的HTML表格。

Answer 1

您可以使用{{#each}}塊幫助程序遍歷數組。例如。

<tbody> 
{{#each getData}} 
<tr> 
    <td>{{date}}</td> 
    <td>{{value}}</td> 
</tr> 
{{/each}} 
</tbody> 

其中getData是提取數據的模板助手。但是，由於您獲得的數據是異步的，因此您不能直接在助手中直接執行Meteor.call()。

解決此問題的一種方法是使用會話變量（'meteor add session'來安裝軟件包）。

首先，你要創建模板時獲取數據並將其設置爲會話變量：

Template.your_template.onCreated(function() { 
    Meteor.call('getData', function(error, result) { 
     // result.data[1] is the array of objects with the data 
     Session.set('bankData', result.data[1]); 
    }); 
}); 

然後，使用模板助手將數據傳遞到模板：

Template.your_template.helpers({ 
    getData: function(){   
     return Session.get('bankData'); 
    } 
});