在使用Polymer'加载所有json文件后执行方法;s的核心ajax
Execute method after all json files are loaded using Polymer's core-ajax
在加载完所有json文件后,我需要执行方法callMe()
。我使用Polymer的核心ajax来加载json文件。我的代码:
<polymer-element name="my-schedule" attributes="speakersUrl sessionsUrl scheduleUrl">
<template>
<core-ajax auto url="{{scheduleUrl}}" handleAs="json" on-core-response="{{scheduleResponse}}"></core-ajax>
<core-ajax auto url="{{sessionsUrl}}" handleAs="json" on-core-response="{{sessionsResponse}}"></core-ajax>
<core-ajax auto url="{{speakersUrl}}" handleAs="json" on-core-response="{{speakersResponse}}"></core-ajax>
</template>
</div>
</template>
<script>
(function() {
Polymer('my-schedule', {
speakersUrl: '../../data/speakers.json',
sessionsUrl: '../../data/sessions.json',
scheduleUrl: '../../data/schedule.json',
speakersResponse: function(event, response) {
this.speakers = response.response;
},
sessionsResponse: function(event, response) {
this.sessions = response.response;
},
scheduleResponse: function(event, response) {
this.schedule = response.response;
},
callMe: function() {
console.log('I was called after all json files loaded');
}
});
})();
</script>
谁能帮我?注意:没有jQuery。
这样就可以了。通过使用observe
,您可以在每次值更改时检查这些值,并等待这三个值都出现。您也可以直接绑定到core-ajax
的response
属性,而不必执行setter。
<polymer-element name="my-schedule" attributes="speakersUrl sessionsUrl scheduleUrl">
<template>
<core-ajax auto url="{{scheduleUrl}}" handleAs="json" response="{{speakers}}"></core-ajax>
<core-ajax auto url="{{sessionsUrl}}" handleAs="json" response="{{sessions}}"></core-ajax>
<core-ajax auto url="{{speakersUrl}}" handleAs="json" response="{{schedule}}"></core-ajax>
</template>
<script>
(function() {
Polymer('my-schedule', {
speakersUrl: '../../data/speakers.json',
sessionsUrl: '../../data/sessions.json',
scheduleUrl: '../../data/schedule.json',
observe: {
'speakers schedule sessions': 'checkReady'
},
checkReady: function() {
if (this.sessions && this.speakers && this.schedule) { this.callMe(); }
},
callMe: function() {
console.log('I was called after all json files loaded');
}
});
})();
</script>
</polymer-element>
有两种方法:
-
检查数据何时准备就绪->调用custom_element,其中在ready()回调中调用callMe()。
<my-template if="{{data_json.list}}"> <my-custom_element pass_data ='{{data_json.list}}' ></my-custom_element></template>
类似:Polymer,如何在渲染其他元素之前等待核心ajax完成?
- 另一种是在scheduleResponse()中调用callMe()
我想我在这里要做的是制作3个true/false变量,每次加载后将加载项的状态设置为true,并检查其他项的状态。为了防止它再次触发,您可以再使用1个变量来检查方法是否已经运行。
示例
<polymer-element name="my-schedule" attributes="speakersUrl sessionsUrl scheduleUrl">
<template>
<core-ajax auto url="{{scheduleUrl}}" handleAs="json" on-core-response="{{scheduleResponse}}"></core-ajax>
<core-ajax auto url="{{sessionsUrl}}" handleAs="json" on-core-response="{{sessionsResponse}}"></core-ajax>
<core-ajax auto url="{{speakersUrl}}" handleAs="json" on-core-response="{{speakersResponse}}"></core-ajax>
</template>
<script>
(function() {
Polymer('my-schedule', {
speakersUrl: '../../data/speakers.json',
speakerStatus: false,
sessionsUrl: '../../data/sessions.json',
sessionStatus: false,
scheduleUrl: '../../data/schedule.json',
scheduleStatus: false,
hasRun: false,
speakersResponse: function(event, response) {
this.speakers = response.response;
this.speakerStatus = true;
this.checkStatus();
},
sessionsResponse: function(event, response) {
this.sessions = response.response;
this.sessionStatus = true;
this.checkStatus();
},
scheduleResponse: function(event, response) {
this.schedule = response.response;
this.scheduleStatus = true;
this.checkStatus();
},
checkStatus: function () {
if (this.speakerStatus && this.sessionStatus && this.scheduleStatus && !this.hasRun) {
this.callMe();
this.hasRun = true;
}
},
callMe: function() {
console.log('I was called after all json files loaded');
}
});
})();
</script>
</polymer-element>
您可以在核心ajax元素上使用on-core-complete事件来检查json何时加载。E.G <core-ajax auto url="{{scheduleUrl}}" handleAs="json" on-core-complete="{{scheduleResponse}}"></core-ajax>
阅读更多:https://www.polymer-project.org/0.5/docs/elements/core-ajax.html
相关文章:
- 无法执行文件.退出Acrobat PDF中的操作
- 只是 JQuery 可执行文件的一部分.当直接粘贴到HTML中时,一切正常(window.location)
- 节点可执行文件中返回了错误的pid
- 如何从浏览器运行可执行文件
- 在全局范围内执行文件,而不是返回导出的对象
- 获取块上的可执行文件标准输出
- 关于使用 Java 或 JavaScript 安装可执行文件的网站
- 如何将字符串参数从 HTML(使用 JavaScript)传递到 Java 可执行文件 Jar
- 要求JS在加载/解析依赖项之前执行文件代码
- Javascript - 如何执行位于 C: 中的可执行文件
- 如何在Visual Studio 2012 for Windows 8中使用JavaScript运行外部可执行文件
- 使用PHP'将网站打包为Windows可执行文件;的内置服务器
- 在gullowwatch上运行可执行文件
- 如何在我的Javascript中执行二进制可执行文件
- 如何使用Node.js在客户端运行可执行文件
- Apache/XAMPP for Windows错误地将文件视为可执行文件
- 如何在本地网络上正确执行C#文件
- 如何将node-js控制台应用程序打包为可执行文件
- 如何创建Javascript可执行文件
- 无法在Nodejs中执行文件上传程序