我有一个与 datepicker 集成的 emberjs 应用程序。当我单击日期选择器上的日期时，计算属性应该将单击的日期与 *timeslot** 上的日期进行比较，以查看是否存在匹配项，并且我希望模板基于此刷新，或者列出可用的 timeSlots或者说没有。不幸的是，模板不会刷新或显示新数据。
这是jsfiddle，重要的控制器/路由/模板是timeSlot、约会、datePicker和 datepickerComponenet。
在 jsfiddle 中，您需要单击查看更多并向下滚动，以查看加载的日历和时间段以红色显示的日期。问题是单击任何以红色着色的日期都应该重新呈现 timeSlot 模板并重新计算displaySelectedDate计算属性。现在，它只呈现时间段模板，即您第一次单击日期时，之后所有后续单击都不会刷新该模板。
这是控制器。似乎计算属性没有被多次调用。结果，以前，我在displaySelectedDate 计算属性上调用了.volatile但没有任何变化，所以我将其删除并添加了此处显示的观察者，但仍然没有任何变化。
App.TimeSlotController = Ember.ArrayController.extend({
needs: 'appointment',
content: [ ],
apptId: null,
apptDate: null,
day: Ember.A([ ]),
contentDidChange: function(){
a = this.get('day');
console.log(a);
return a;
}.observes('day'),
displaySelectedDate: function(){
a = moment(this.get('apptDate')).unix();
b = moment.utc(this.get('day').toString()).unix();
x = (a === b);
return x;
}.property('day.@each', 'apptDate'),
});
我通过首先获取约会来填充 timeSlot的路线
App.TimeSlotRoute = Ember.Route.extend({
setupController: function(controller, model) {
self = this;
self._super(controller, model);
parent = self.controllerFor('appointment');
self.controller = controller;
c = parent.get('timeSlots').then(function(data){
f = self.controller.set('content', data);
});
}
})
提供日期数组的日期选择器控制器，这些日期将在日期选择器中着色。如果我们使用获取约会 startDate的dateArray 计算属性的未注释版本，则日期按预期着色。但是，如果注释第一个版本并取消注释通过 startTime获取timeSlot 的dateArray 计算属性的第二个版本，则 calebdar 不会着色。任何想法为什么会这样。
App.DatePickerController = Ember.ArrayController.extend({
needs: ['appointments', 'appointment', 'timeSlot'],
time: Ember.computed.alias('controllers.timeSlot.content'),
appointments: Ember.computed.alias('controllers.appointments.content'),
dateArray: function(){
_this = this;
var fetchDates = _this.get('appointments');
return fetchDates.map(function(item){
return moment.utc(item.get('startDate')).format("YYYY-MM-DD");
});
}.property('appointments.@each.startDate'),
/*
dateArray: function(){
_this = this;
var fetchDates = _this.get('time');
return fetchDates.map(function(item){
return moment.utc(item.get('startTime')).format("YYYY-MM-DD");
});
}.property('timeSlot.@each.startTime'),
*/
});
这是相同代码的较小版本，我创建了第二个jsfiddle。在此版本中，删除了datePicker控制器和路由，并将其拥有的代码移至约会控制器。如果单击它，您将看到带有约会的时间段没有变成应有的红色。
App.AppointmentController = Ember.ObjectController.extend({
dateArray: function(){
_this = this;
fetchDates = [ ];
var aa = _this.get('content');
var yy = aa.get('timeSlots');
yy.then(function(hh){
nn = hh.map(function(item){ return moment.utc(item.get('startTime')).format("YYYY-MM-DD");
});
pp = fetchDates.pushObjects([nn]);
return nn;
});
return fetchDates;
}.property('content.@each.timeSlots')
});
执行 控制台日志建议约会控制器中的dateArray以以下形式返回数组：
[Array[2]]
但是，当使用第一个版本的 dateArray计算属性时， datepickerController 返回的数组通过约会 startDate为日历着色，其形式为：
["2013-10-18", "2013-10-25", "2013-10-25", "2013-10-18"]
我想要的是
是非常单击 datePicker 中的日期以重新呈现timeSlot模板，其次是让我能够使用约会控制器或来自datePicker 控制器的dateArray 计算属性的第二个版本在日历中加载timeSlot startTime。
这是基于第一个 jsfiddle 的日历上的约会 startDate 的屏幕截图
这是我尝试根据第二个 jsfiddle 或第一个 jsfiddle 的 datepicker 控制器中注释掉的 dateAarray 属性将 timeSlot startTime 传递给日历时的屏幕截图。请注意，在这两种情况下，日历均未着色
谢谢你的帮助。