Question

每当发生路线更改时，我都会尝试从vimeo.com/<id>文件中调用其中一个函数。

这是我在javascript文件中的代码，我需要调用，需要调用angular中的vimeo.com/<id>函数。

.js和appData的{{1}}正常工作，并且我得到了JSON响应。

console.logs

我在

中调用console.log(parsedJsonResponse);函数

console.log(appData)

这是我用角度调用该函数的代码。

以角度调用此函数时，我得到window.dataLayer = (function () { var dataCall = function () { return new Promise((resolve, reject) => { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function () { if (this.readyState == 4) { if (this.status == 200) { resolve(this.responseText); } else { console.log(this.status + '.....' + this.statusText) } } }; xhttp.open("GET", "http://localhost:4200/assets/sample.json", true); xhttp.send(); }) } dataCall().then((CallResponse) => { getData(CallResponse) }); window.addEventListener("load", function (event) { appData(); }) var getData = function (cData) { jsonResponse = cData.replace(/'/g, '"'); parsedJsonResponse = JSON.parse(this.jsonResponse); var appData = parsedJsonResponse['content']['copy$$' + applicationContent]; console.log(parsedJsonResponse); }。

appData

出了什么问题？谢谢。

Answer 1

尝试在dataLayer函数内部声明parsedJsonResponse变量：

RippleDrawable

编辑

发生这种情况的原因是，当ajax响应来自服务器时，您的变量parsedJsonResponse会获取其值。这意味着，这取决于异步操作。您能做的就是等待诺言中的回应。我的建议是将诺言保留在新变量 getAsyncData 中：

window.dataLayer = (function () {
   var parsedJsonResponse;
   /* rest of your code */

也不要忘记将变量添加到返回对象中

var getAsyncData = dataCall().then((CallResponse) => {
  getData(CallResponse)
});

，您可以像这样在您的角度应用程序中使用它：

return {
  appData: appData,
  dataCall: dataCall,
  getAsyncData: getAsyncData
}

我注意到的另一件事是，您在getData函数中使用applicationContent，但尚未在函数dataLayer中对其进行初始化。 appData中该变量的唯一用法：

dataLayer.getAsyncData.then(() => {
 dataLayer.appData();
});

您还应该考虑在函数顶部初始化该变量。

var appData = function (applicationContent) {

这里是代码，我在您的代码上做了一些细微的更改（这里我将响应发送到jsonplaceholder服务器，因此解析该响应是不同的，并且我还删除了load事件监听器：

https://jsbin.com/birofufade/edit?html,js,console,output

Answer 2

如果要在其他函数中使用

parsedJsonResponse变量，则应在所有函数之外声明该变量。否则，parsedJsonResponse是getData函数专有的。

window.dataLayer = (function () {
   var parsedJsonResponse;
   // ...rest

接下来，您需要删除窗口加载事件内的函数调用。 appData()在window load中被调用，但是数据仍在获取，并且parsedJsonResponse没有内容。

window.addEventListener("load", function (event) {
    // appData();
})

在getData函数中删除this，因为jsonResponse是私有变量。

 parsedJsonResponse = JSON.parse(jsonResponse);

我希望这会有所帮助。

编辑： 无论如何，我不鼓励使用外部js文件。尝试在Angular应用中使用服务。

更新：您没有在dataLayer.appData()中传递参数。您没有在API请求中正确处理异常。

在angular 5中调用javascript函数时出现参考错误

2 个答案: