如何從Ember控制器訪問查詢參數

Question

我正在開發一個習慣跟蹤應用程序 。 我從習慣列表開始。 當用戶單擊習慣時，它將為該習慣創建一個新事件。 我有工作清單，但是創建新活動有困難。

要創建一個新事件，我有以下路線：

App.Router.map( function() {
  ⋮
  this.resource( 'new_event', { path: '/event/new/:habit_id' } )
} )

然后關聯的路由器是：

App.NewEventRoute = Ember.Route.extend( {
  model: function(params) {
    return this.store.find( 'habit', params.habit_id )
  },
  setupController: function( controller, model ) {
    controller.set( 'selectedHabit', model )
  }
} )

據我所知，唯一可以訪問查詢參數的地方是在模型函數中。

那么，控制器為：

App.NewEventController = Ember.ObjectController.extend( {
  init: function() {
    console.log( 'init', this.get( 'selectedHabit' ) )
    // Logic for adding a new event for the habit
    this.transitionToRoute( 'events' )
  },
  selectedHabit: null,
  ⋮

selectedHabit的返回值為null 。

Answer 1

這實際上是有道理的，因為在調用setupController ，控制器已作為參數傳遞，因此已被初始化（例如http://emberjs.jsbin.com/cuwadafu/1/edit ）。 這意味着已經調用了init函數，並且尚未設置selectedHabit屬性。

一種解決方案可能是使用觀察到selectedHabit屬性的所有邏輯來創建用於創建事件的通用函數（ 也可以從其他地方調用該函數）。

App.NewEventController = Ember.ObjectController.extend( {
/*passing an optional parameter of habitId, to make this generic, could be an option*/
  addNewEvent:function(/*habitId*/){
  // Logic for adding a new event for the habit
    this.transitionToRoute( 'events' )
  }.observes("selectedHabit"),
  .
  .
});

Answer 2

在Ember討論板上對此進行了回答 。 我沒有使用路由，而是執行了一個動作：

<script type="text/x-handlebars" id="habits">
  <div id="habits">
    {{#each}}
      <div class="row" {{action 'createEvent' id}}>
        <div class="col-xs-1 color" {{bind-attr style=style}}></div>
        <div class="col-xs-8">{{name}}</div>
        <div class="col-xs-3" data-role="timer">{{format-time-numeric lastTime}}</div>
      </div>
    {{/each}}
  </div>
</script>

腳本

App.HabitsRoute = Ember.Route.extend( {
  actions: {
    createEvent: function( habitId ) {
      var self = this
      var store = this.get( 'store' )
      store.find( 'habit', habitId ).then( function( habit ) {
        store
          .createRecord( 'event', {
            habit: habit,
            time: new Date()
          } )
          .save().then( function( event ) {
            habit.get( 'events' ).then( function( events ) {
              if( ! events ) {
                events = []
                habit.set( 'events', events )
              }
              events.pushObject( event )
              habit.save().then( function() {
                self.transitionTo( 'events' )
              } )
            } )
          } )
      } )
    }
  }
} )