Блог

Usecase: мастер с несколькими шагами. Изначально реализовано с использованием {{partial currentStepTemplate}} .

Я хочу реорганизовать это, чтобы иметь отдельный контроллер для каждого шага. Изначально было сделано {{render currentStepTemplate controller=currentStepController}} , но в отличие {{partial}} от, render не привязан к currentStepTemplate свойствам currentStepController and и использует их как необработанные строки.

Я создал маршрут /walkthrough/:step .

Проблема в том, что на маршруте нет конкретной модели, которую нужно загрузить, но мне нужно знать, какой шаблон отображать, используя :step параметр, который доступен только в model hook.

Не похоже, что это хороший шаблон для использования модели только как способа step дальнейшей передачи параметра в setupController и renderTemplate , но я не уверен, как еще я мог бы этого добиться.

 App.WalkthroughRoute = Ember.Route.extend(
  steps: ["", "intro", "name", "photo", "create_course"]

  model: (params) ->
    @set('stepName', params['step'])
    @set('stepTemplate', "walkthrough/teacher/_step_#{stepName}")

    # Optional controller: used only if exists
    if @container.lookup("controller:#{controllerName}")
      @set('stepController', controllerName)

    return @steps.indexOf(params['step'])

  renderTemplate: (controller, model) ->
    @render()
    @render @get('stepTemplate'),
      controller: @get('stepController')
      into: 'walkthrough'

  actions:
    nextStep: ->
      step = @modelFor('walkthrough')
      @transitionTo('walkthrough.teacher', @steps[step   1])

    prevStep: ->
      step = @modelFor('walkthrough')
      @transitionTo('walkthrough.teacher', @steps[step - 1])
)
  

Какие-либо подсказки / идеи? Спасибо!

Я почти уверен, что вы пытаетесь воссоздать, как уже работает маршрутизатор. Я бы переместил каждый шаг в маршруты под ресурсом. Тогда ваш URL-адрес будет выглядеть следующим образом:

 #/walkthrough/step1
#/walkthrough/step2
#/walkthrough/step3
#/walkthrough/step4
  

с маршрутизатором, подобным

 App.Router.map(function() {
  this.resource('walkthrough', function(){
    this.route('step1');
    this.route('step2');
    this.route('step3');
    this.route('step4');
  });
});
  

http://emberjs.jsbin.com/musugiru/1/edit