Ember.js 2.2 - Как обновить модель маршрута от компонента?

Question

С Эмбер 2.2.0, у меня есть маршрут:

Dash.BacklogReportsRoute = Ember.Route.extend 
    model: -> 
    @store.queryRecord "report", newest: true 

и компонент:

Dash.BacklogReportComponent = Ember.Component.extend 
    report: null 
    actions: 
    generate: -> 
     # Send the request. 
     $.ajax 
     type: "post", 
     url: "/reports/generate/#{new Date().getFullYear()}", 
     success: => 
      # Update the model. 
      # TODO - how to reload the model in place? Or at least just refresh 
      # the Route so we don't have to reload the entire app. 
      window.location.reload() 

, которая включает в себя как часть шаблона:

<p> 
    Report was generated {{report.timestamp}}. 
</p> 

где timestamp является вычисленное свойство в модели отчета.

---

модель Маршрут является самым последним объектом Report, и через POSTgenerate действие заставляет сервер создать новую (таким образом, более свежий) отчет. Я хочу обновить временную метку этого [нового] ​​отчета.

Мой вопрос: в Ember 2, как я могу заставить Route обновиться? Я новичок в Ember, поэтому я не уверен, что можно получить доступ к Маршруту непосредственно изнутри Компонента (или если я может, если это хорошая идея). Я не думаю, что просто перезагрузка модели будет работать, потому что после успешного POST другая модель (т. Е. Запись с другим id) будет возвращена @store.queryRecord "report", newest: true, чем при загрузке страницы. Существующая модель будет такой же после POST.

В качестве альтернативы, я был бы совершенно счастлив полностью перерисовать маршрут (это очень простая страница) или перейти на эту страницу снова, но я не могу понять, как это сделать.

На данный момент я просто заставляю страницу старой школы window.location.reload().

Рассматривая это по-другому, возможно, существует более идиоматический подход к решению этой проблемы с Эмбером.

Должен ли я загружаться во все (или некоторые) отчеты с помощью маршрута и заставлять обновление в этой коллекции после POST? Я вижу, что Enumerable имеет свойство .firstObject - это то, что вычисленное свойство (другими словами, если моя модель маршрутов представляет собой сборник отчетов, и я нажимаю на нее перед этой коллекцией, будет ли это изменение автоматически распространяться через .firstObject?)

Answer 1

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

Итак, сначала вы должны отправить действие от ваших generate действий в компоненте:

Dash.BacklogReportComponent = Ember.Component.extend 
    report: null 
    actions: 
    generate: -> 
     # Send the request. 
     $.ajax 
     type: "post", 
     url: "/reports/generate/#{new Date().getFullYear()}", 
     success: => 
      @sendAction('didGenerate') 

Далее вам необходимо подключить действие в шаблоне, так что ваш контроллер/маршрут получает уведомление, когда она вызывается :

{{backlog-report report=report didGenerate='didGenerateReport'}} 

И теперь вы можете «поймать» это действие в своем контроллере или маршруте.Мы будем делать это в þér маршрута таким образом, мы можем обновить его:

Dash.BacklogReportsRoute = Ember.Route.extend 
    actions: 
    didGenerateReport: -> 
     @refresh() 
    model: -> 
    @store.queryRecord "report", newest: true 

Извините, если я сделал какую-то ошибку с CoffeScript (не использовать его для спокойного некоторого времени). Также есть другие вещи, которые вы могли бы улучшить. Как правило, я не ставил бы вызов ajax в компоненте, я бы поместил его в контроллер/маршрут, если это было возможно, и вызовет его действием (у меня просто есть опыт, что лучше избегать помещать ajax-вызовы в компонент, хотя там являются для него обязательными).

Я бы вообще предложил прочитать все ember guides, если вы еще этого не сделали. Они довольно хороши, и пока вы не поймете все, начиная с первого прочитанного, вы, по крайней мере, будете более или менее знать, что искать, или что возможно.

Answer 2

Если вам нужно вручную перезагрузить страницу, там действительно должен быть лучший способ. Ember, как и другие аналогичные структуры, являются SPA (одностраничное приложение) и делают свою магию при очень эффективном обновлении только частей страницы.

---

, как говорится, если вы хотите получить доступ к router из controller/component путем направления действия в router и обработки изменений в этом action.

см действия кипящего https://guides.emberjs.com/v1.10.0/templates/actions/