2017-05-31 80 views
0

我已經在那裏我宣佈,我想在一個腳本在HTML中使用一個變量js文件訪問一個js文件的變量上的HTML文件

js文件(controllerB.js)

var modalArticles = []; 
$(document).ready(function() { 
    $.ajax({ 
     url: "https://newsapi.org/v1/articles?source=google-news&sortBy=top&apiKey=*****" 
    }).then(function (data) { 

     modalArticles = data.articles; 
    }) 
}) 

HTML文件

<head> 
<meta charset="utf-8" /> 
<title>News</title> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

<script src="js/handlebars-v4.0.10.js"></script> 
<script type="text/javascript" src="js/controllerB.js"></script> 


</head> 
<body></body> 
<script type="text/javascript"> 
    console.log('print: ' + modalArticles); 
</script> 

modalArticles是HTML空

+0

這樣的事情? http://plnkr.co/edit/oyThCOliuBHVFBgYZQTg?p=preview –

回答

2

你的變量是空的,因爲它只有在在你的文檔被加載的地方被初始化了。 您使用異步請求填充變量,因此只有在Promise解析時纔可用。

如果要在HTML中顯示變量的內容,可以使用jquery(根據您的標記)來設置要顯示的元素的HTML,以將內容設置爲方法then

如果你想讓它顯示在「#mydiv」,你可以這樣做:

.then(function(value){ 
    $('#mydiv').html(value); 
}) 
+0

即時嘗試做的是創建一個數組,我將在html中進行迭代,而不僅僅是在div上顯示內容 –

+0

然後迭代數組中的值你的'then'函數並將這些值添加到DOM,或者做任何你想做的事情。 – Strernd