Как сохранить определенные представления ember?

Я создал вкладки для модуля приложения, которые имеют значительное количество html-тегов для рендеринга. Представления для маршрутов отображаются каждый раз, когда пользователь меняет подмодуль.Как сохранить определенные представления ember?

example.com/module/tab 
example.com/module/other-tab 
example.com/module/different-tab

Пользователь будет переключаться между этими вкладками много, я думаю. В этом случае я хотел бы продолжить работу в DOM. Я имею в виду скрыть и показать переходы в этом конкретном модуле вместо удаления из dom и rerender. Это похоже на таблицу Google, когда вы меняете листы. Первый раз он загружается, а затем переключается немедленно.

Я сведущий, чтобы скрыть вынесенное представление о переходе от

App.ModuleTab = Ember.View.extend 
    destroy: -> 
     @.$().hide().addClass('module-tab')

но как я могу отобразить скрытый вид вместо перерисовку? Должен ли я каким-то образом изменить метод?

источник

2014-08-30 Mateusz Nowak

Разница между рендерингом и каким-то образом восстановлением/открытием существующей DOM, вероятно, будет порядка менее 100 мс. Если вас это действительно волнует, тогда ответ @ Andrew Hacking правильный. – 2014-09-02 14:29:54

Вы вероятно хотели бы реализовать с сохранением состояния вкладок с помощью Ember queryParams вместо использования маршрутов как нормальный переход маршрута приведет к мнениям по вашему маршруту module быть снесено. Ember queryParams на некоторое время были в бета-версии и канарейках Ember и только что приземлились в официальном выпуске Ember v1.7.0 10 дней назад.

Для хорошего примера/решения для реализации вкладок с использованием queryParams Я бы предложил посмотреть на ic-tabs или Ember component project для некоторых хороших примеров.

Если вкладки содержат сложные взгляды и необходимы отдельные контроллеры, вы можете добиться этого с помощью render помощника для содержания каждой вкладки:

{{render 'module/tab-xx'}}

Ember будет искать шаблон в `модуле/tab-xx 'и контроллер с именем ModuleTabXXController, который будет создавать и привязывать представление. См. Ember guides on rendering views with helpers

Затем вы можете дополнительно условно выделить рендер, если хотите визуализировать только при видимости вкладки. например:

{{#ic-tabs selected-index=country}} 
    {{#ic-tab-list}} 
     {{#ic-tab}}Australia{{/ic-tab}} 
     {{#ic-tab}}United Kingdom{{/ic-tab}} 
     {{#ic-tab}}USA{{/ic-tab}} 
    {{/ic-tab-list}} 

    {{#ic-tab-panel}} 
     {{#if active}} 
     {{render 'country/au' auModel}} 
     {{/if}} 
    {{/ic-tab-panel}} 

    {{#ic-tab-panel}} 
     {{#if active}} 
     {{render 'country/uk' ukModel}} 
     {{/if}} 
    {{/ic-tab-panel}} 

    {{#ic-tab-panel}} 
     {{#if active}} 
     {{render 'country/us' usModel}} 
     {{/if}} 
    {{/ic-tab-panel}} 

    {{/ic-tabs}}

источник

2014-09-02 14:03:48

Я проверил 'queryParams' в пару минут, но заранее у меня есть один вопрос. Должен ли я отображать все модули сразу? Каждый из них составляет примерно 1 секунду, поэтому я сильно не люблю идею рендеринга нескольких модулей одновременно. Более того, я хочу сохранить свою логическую структуру кода. Один большой контроллер не является оптимальным вариантом. –

Обновленный ответ для удовлетворения дополнительных требований. –

-1

Вы должны переопределить метод createElement и проверить, существует ли элемент уже и скрыт.

App.ModuleTab = Ember.View.extend 
    createElement: -> 
    if @get 'element' 
     @.$().show() 
     @ 
    else @._super.createElement() 
    destroy: -> 
    @.$().hide().addClass('module-tab')

источник

2014-09-01 14:47:08 user3995789

Не работает. Ember добавляет новый элемент в dom и сохраняет старый. –

@estshy О, хорошо, вы не можете сделать это с помощью Ember.View, потому что, когда вызывается destroy, экземпляр Ember.View исчез. Поэтому, когда визуализируется новое представление, создается новый экземпляр Ember.View, который не имеет понятия о старом, поэтому, если вы действительно хотите взломать, используйте '$ ('module-tab-and-other-specific-selector-for -the-old-tab ') 'вместо' @get' element''. Надеюсь, ты получишь мою идею. – user3995789

Даже с уникальным селектором и 'if $ ('# some-unique-id'). Length' ember все еще выглядит rerender. –

Как сохранить определенные представления ember?

ответ

Смежные вопросы