Javascript 控制器中的Emberjs-1.0组件和计算属性

我正在将控制器传递到。控制器有一个名为dateArray的计算属性，该属性保存日期数组。单击指向约会模板的链接后，我可以进入控制台执行以下操作：

    b = App.__container__.lookup("controller:appointment")
    c = b.get('dateArray')
    and it returns [Array[2]]

但是，当我将该控制器传递到带有

      {{date-picker datePickerController=controller}}

在组件内部，我可以使用下面的代码获得控制器的正确实例

 datePicker = _this.get('datePickerController');
 console.log(datePicker), shows the dateArray with its content.

但是当我使用下面的代码基于上面的实例对其进行检查时，数组显示为空

  controllerContent = datePicker.get('dateArray'); 

但是，如果我在约会模板中的把手表达式中添加dateArray，它将呈现其内容：

  {{dateArray}}

那么，当控制器实例emberjs组件具有dateArray时，为什么它的dateArray在emberjs组件中为空

控制员：

App.AppointmentController = Ember.ObjectController.extend({
   needs: [ 'timeSlot'],
   timeSlotController: Ember.computed.alias('controllers.timeSlot'),
   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')


});

emberjs组件：

App.DatePickerComponent = Ember.Component.extend({
   datePickerController: null,

   didInsertElement: function() {
     this._super();
     _this = this;
     var datePicker;

     datePicker = _this.get('datePickerController');
    //console.log(datePicker);

     var controllerContent = datePicker.get('dateArray');    

    //returns nil
     alert(controllerContent); 

    });// closes didInsertElement

  }

 });

---

在余烬中，控制器是一个很奇怪的东西，它只是模型上的装饰器，如果你的模型在控制器下发生了变化，那么你的控制器可能会完全不同（也许这就是你的意图）。您可以尝试将dateArray传递到组件中。

在Ember中，传递控制器是一件奇怪的事情，它只是模型上的装饰器，如果您的模型在控制器下发生更改，那么您的控制器可能会完全不同（可能这是您的意图）。您可以尝试将dateArray传入组件。

您的问题是

dateArray

属性是异步的，因为您使用的是

yy。然后

情况就是这样：

您调用
datePicker.get（'dateArray'）
此触发器
yy。然后
但它不能立即解析，您将
fetchDates
作为空数组返回。当
yy.then
load时，它将使用
fetchDates.pushObjects（[nn]）
填充数组，因此这将更新模板

我建议您观察阵列中的更改以执行所需的操作：

App.DatePickerComponent = Ember.Component.extend({
  datePickerController: null,
  dateArrayChanged: function() {
    var dateArray = this.get('datePickerController.dateArray');
    // now date array have elements
  }.observes('datePickerController.dateArray.[]')
 });

您的问题是您的
dateArray
属性是异步的，因为您使用的是
yy.then

情况就是这样：

您调用
datePicker.get（'dateArray'）
此触发器
yy。然后
但它不能立即解析，您将
fetchDates
作为空数组返回。当
yy.then
load时，它将使用
fetchDates.pushObjects（[nn]）
填充数组，因此这将更新模板

我建议您观察阵列中的更改以执行所需的操作：

App.DatePickerComponent = Ember.Component.extend({
  datePickerController: null,
  dateArrayChanged: function() {
    var dateArray = this.get('datePickerController.dateArray');
    // now date array have elements
  }.observes('datePickerController.dateArray.[]')
 });

如果将断点添加到dateArray computed属性中，那么在这一行上再次调用get时是否会命中断点：var controllerContent=datePicker.get（'dateArray'）；如果将断点添加到dateArray computed属性中，那么在这一行上再次调用get时是否会命中断点：var controllerContent=datePicker.get（'dateArray'）；这是通过在componenet的模板上显示来实现的，但是，我使用的是a.forEach（函数（项）{return item；}）；尝试在componenet本身中循环它，但它仍然是未定义的。任何建议这都是通过在组件网的模板上显示来实现的，但是，我使用的是a.forEach（函数（项）{return item；}）；尝试在componenet本身中循环它，但它仍然是未定义的。任何建议谢谢@Márcio的帮助性解释。你是对的，因为我现在可以从dateArrayChanged内部获取数组。对于从dateArrayChanged内部更新以包含日期的dat函数返回未定义的日期，您有什么建议吗。它们都是在dat函数use b=this.get（'datePickerController.dateArray'）中的DatePickerComponent中定义的；不要忘记使用get和set来读取/更新余烬的属性objects@Edu，谢谢你的建议。我仍然有一个问题，在didInsertElement中调用dat函数时使用类似alert（this.dat（））；，仍然返回未定义的事件，尽管在dat函数或方法中，我有一个警报（this.get（'datePickerController.dateArray'））返回正确的内容。这是一个例子。在datePicker组件中，dat函数是在didInsertElement之后定义的。谢谢。谢谢@Márcio的帮助解释。你是对的，因为我现在可以从dateArrayChanged内部获取数组。对于从dateArrayChanged内部更新以包含日期的dat函数返回未定义的日期，您有什么建议吗。它们都是在dat函数use b=this.get（'datePickerController.dateArray'）中的DatePickerComponent中定义的；不要忘记使用get和set来读取/更新余烬的属性objects@Edu，谢谢你的建议。我仍然有一个问题，在didInsertElement中调用dat函数时使用类似alert（this.dat（））；，仍然返回未定义的事件，尽管在dat函数或方法中，我有一个警报（this.get（'datePickerController.dateArray'））返回正确的内容。这是一个例子。在datePicker组件中，dat函数是在didInsertElement之后定义的。谢谢