要了解Ember,我一直在尝试制作一个计算时区的简单应用程序。
当一个人进入他们的城市和另一个人的城市时,我向我的API发出GET请求,该API会返回这样的日期 -
great_times: [array]
good_for_me: [array]
good_for_them: [array]
在把手中,我有
<div class="container">
<div class="col-md-6 col-md-offset-3">
<header>
<h2>We found <span class="twenty-four-header">{{totalTimes}}</span>
great meeting {{pluralize totalTimes 'time' 'times'}} for you!</h2>
</header>
<div class="main-content">
<div class="row">
<div class="col-md-6">
<div class="form-group">
{{view RightTime.AutoCompleteAddressView value=myCity placeholder="What's your city?"
class="form-control input-lg" latLng=myLatLng}}
</div>
</div>
<div class="col-md-6">
<div class="form-group">
{{view RightTime.AutoCompleteAddressView value=theirCity placeholder="What their city?"
class="form-control input-lg" latLng=theirLatLng}}
</div>
</div>
</div>
{{#each meetingTime in greatTimes}}
{{render 'meetingTime' meetingTime }}
{{/each}}
</div><!--main-content-->
</div>
</div>
这样可行,但是当我更新城市时,它不再更新每个循环。
我确实知道模型已更新,因为{{totalTimes}}计算属性确实更新了。
这就是我的会议对象的样子:
RightTime.Meeting = Ember.Object.extend({
meetingTimes: null,
myCity: null,
theirCity: null,
myLatLng: null,
theirLatLng: null,
totalTimes: function() {
if (this.meetingTimes) {
return this.meetingTimes.great_times.length;
}
}.property('meetingTimes'),
locationsData: function() {
return {
myLatLng: [this.myLatLng.k, this.myLatLng.A],
theirLatLng: [this.theirLatLng.k, this.theirLatLng.A]
}
}.property('myLatLng', 'theirLatLng'),
findTimes: function() {
var meeting = this;
if (this.myLatLng && this.theirLatLng) {
$.ajax({
url: 'api/meetings',
type: 'GET',
data: meeting.get('locationsData')
}).done(function(response){
meeting.set('meetingTimes', Ember.A(response));
});
}
}.property('myLatLng', 'theirLatLng')
});
我感觉问题出在
.done(function(response){
meeting.set('meetingTimes', Ember.A(response));
});
我正在重置整个会议时间数组,这可能是错误的方法。
你将如何使meetingTimes arrray更新并反映在把手中?
答案 0 :(得分:1)
我可能只是将great_times
移动到依赖于meetingTimes
并且没有链接的计算属性中。
类似
greatTimes: function() {
return Em.get(this, 'meetingTimes.great_times') || [];
}.property('meetingTimes'),
使用这样的模板
{{#each meetingTime in greatTimes}}
{{render 'meetingTime' meetingTime }}
{{/each}}