我正在为应用程序中的对话框功能使用ember-modal-dialog插件。现在对话框中显示的数据是从服务器请求的,因此每次单击按钮时它应该请求服务器并显示接收到的数据。
feed.hbs
{{#each feedResult as |feed|}}
<p {{action "toggleModal" feed.fivers_pk }}> {{feed.numFives}} </p>
{{#if isShowingModal}}
{{#modal-dialog close="toggleModal"}}
<p>People who Hi-Fived this</p>
<img src = "images/shape-line-separator.png">
Data from server
{{/modal-dialog}}
{{/if}}
{{/each}
Controller.js(feed.js)
import Ember from 'ember';
import raw from 'ic-ajax';
const { service } = Ember.inject;
export default Ember.Controller.extend({
session:service('session'),
isShowingModal: false,
fivers:[],
feedResult:Ember.computed('model',function() {
SOME MANIPULATION WITH DATA
}),
actions:{
toggleModal: function(fiverpk) {
this.toggleProperty('isShowingModal');
console.log(fiverpk);
raw({
url: "http://example.com/api/photos/"+fiverpk+"/fivers/",
type: 'GET',
});
},
}
});
我可以在动作中通过ajax调用向服务器发出请求并接收数据,但是我应该在哪里以及如何存储它,以便在打开时可以在modal-dialog中使用它。
您不会对AJAX请求的返回结果执行任何操作。您可以执行以下操作
raw({
url: "http://example.com/api/photos/"+fiverpk+"/fivers/",
type: 'GET',
}).then(function(result) {
// add the relevant part of the result to the modal
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句