为什么当我使用bootstrap datepicker时，Ember.js会丢失valueBinding？

Question

我注意到，在我的应用程序中，当我使用下面的代码时，我在日期选择器小部件中给出了格式化的日期，但是当我单击搜索时，控制台显示空字符串。但是，如果我删除didInsertElement方法我失去的日期选择器弹出，但绑定仍然存在，该控制台显示我输入的日期。

在我的车把模板

{{view App.DateField valueBinding="controller.startDate" classNames="startDate"}} 
{{view App.DateField valueBinding="controller.endDate" classNames="endDate"}} 
<button {{action "search" target='controller'}}>Search</button> 

在我的应用程序

App.ApplicationController = Ember.ArrayController.extend({ 
    search: function() { 
    console.log(this.get('startDate')); 
    return console.log(this.get('endDate')); 
    } 
}); 

App.DateField = Ember.TextField.extend({ 
    didInsertElement: function() { 
    return this.$().datepicker(); 
    } 
}); 

当我设置didInsertElement时，有什么想法让我失去数据绑定？

版本： bootstrap-datepicker，

handlebars-1.0.0-rc.3 
ember-1.0.0-rc.3 
jQuery 1.9.1 

Answer 1

我认为问题是，日期选择器和灰烬都可以看到值以不同的方式改变。看看这个：

App.DateField = Ember.TextField.extend(
    didInsertElement: -> 
     @.$().datepicker().on 'changeDate', => 
     @.$().trigger('change') 
) 

当控件变化事件触发，如果你回过头来触发元素上的变化时，则应该灰烬登记的事实结合已更新。

Answer 2

这是我正在做这件事。

App.DatePicker = Ember.View.extend 
    tagName: "input" 
    date: null 
    attributeBindings: ['value','format','readonly','type','size'] 
    size:"16" 
    type: "text" 
    format:'mm/dd/yyyy' 

    value: (-> 
    if date = @get('date') 
     date 
    else 
    "" 
).property('date') 

    didInsertElement: -> 
    fmt = @get('format') 

    onChangeDate = (ev) => 
     @set 'date', ev.date 

    @.$().datepicker(
     format: fmt, 
     autoclose: true 
    ).on('changeDate', onChangeDate) 

    willDestroyElement: -> @$().datepicker('remove') 


#in your template 
{{view App.Datepicker dateBinding="content.date"}} 

Answer 3

在我的灰烬引导克隆请看：

Ember Bootstrap DatePicker