1

给定特定路线，我无法在我的视图中触发自定义功能。

通常，如果我访问/posts/1，并且我的视图中有这个

{{ id }}

无论我是从我的应用程序中导航到路线，还是在页面刷新时第一次访问 /posts/1，id 都会更新。

但是，如果模板不那么直接怎么办？例如，我正在使用具有自己的 API 的日期选择器来更新显示。所以，当数据发生变化时，我需要调用

this.$('#dp').datepicker('setDate', month)

如果路线从应用程序内更改，我可以使用此功能，但如果用户从这些路线之一开始怎么办？我尝试在视图上添加自定义方法

App.DatepickerView = Ember.View.extend({
    didInsertElement: function() {
        ....
    },

    setMonth: function(month) {
        this.$('#dp').datepicker('setDate', month.get('id'));
    }
});

并像这样连接到路线：

App.MonthRoute = Ember.Route.extend({
    setupController: function(controller) {
        App.DatepickerView.setMonth(controller.get('model'));
    }
})

但我知道这setMonth是未定义的。解决这个问题的正确方法是什么？

更新：这是 Datepicker 的模板：

{{#view App.DatepickerView }}
  <div class="filter-section">
    <div id="dp" class="input-prepend date">
      <span class="add-on"><strong>Month</strong></span>
      <input class="span2" type="text" placeholder="Select a month">
    </div>
  </div>
{{/view}}
4

2 回答 2

1

我认为你可以用稍微不同的方式来解决这个问题。我会将绑定的内容传递给日期选择器视图，而不是尝试直接在视图上调用方法。我使用 syncDates 方法来完成将我的值映射到 JQUI 小部件的实际工作（您的需求可能在此处略有不同）。

模板内：

{{view App.DateView valueBinding="some_date"}}

查看代码：

App.DateView = Em.View.extend
  template: Em.Handlebars.compile '<input type="text" /><input type="hidden" {{bindAttr value="view.value"}} />'
  syncDates: ( ->
    if (elm = @$('input[type=text]') ).length && d = @get 'value'
      d = d.split '-'
      elm.val d[1] + '/' + d[2] + '/' + d[0]
  ).observes 'value'

  didInsertElement: ->
    return unless $.datepicker
    @$('input[type=text]').datepicker
      altField:   @$ 'input[type=hidden]'
      format:     'mm/dd/yy'
      altFormat:  'yy-mm-dd'

      onSelect: (dateText, inst) =>
        @set 'value', @$('input[type=hidden]').val()
于 2013-07-23T18:13:59.610 回答
0

如果您使用的是 jquery ui datepicker 并且需要整个日历，我建议您执行以下操作：

创建日期选择器字段

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

更新您的模板以使用视图

 <div class="filter-section">
    <div id="dp" class="input-prepend date">
      <span class="add-on"><strong>Month</strong></span>
      {{view App.DatePickerField valueBinding="yourDate"}}
      <input class="span2" type="text" placeholder="Select a month">
    </div>
  </div>

或者，如果您只想绑定月份，请使用选择标签

App.months = ["JAN", "FEV", "MAR" ...]

<div class="filter-section">
    <div id="dp" class="input-prepend date">
      <span class="add-on"><strong>Month</strong></span>
      {{view Ember.Select contentBinding="App.months" selectionBinding="yourMonth" class="span2" prompt="Select a month" }}
    </div>
  </div>
于 2013-07-23T18:39:51.280 回答