ember.js - Ember Route transition, prevent templates destroy. -

ember.js - Ember Route transition, prevent templates destroy. -

this have in app.js. index route flights & cars nested routes.

this.resource('index',{ path: '/' }, function(){ this.route('flights'); this.route('cars'); });

application.hbs

<div class="main"> {{outlet}} </div>

index.hbs

..some html here... {{outlet}} ..some html...

cars.hbs

{{#some-component1}} {{/some-component1}}

flights.hbs

{{#some-component2}} {{/some-component2}}

cars , flights kind off tabs(links), when clicked utilize link-to load corresponding route domain/app/#/flights loads flights hbs in index.hbs outlet in turn loaded in application.hbs outlet. when user clicks cars url changes to domain/app/#/cars , loads cars.hbs in index.hbs outlet.

but when transition happens flights rendered template destroyed along components had , corresponding component class objects , cars template , components rendered. fine.

now when user moves back(click on flights link) flights flights components/templates re created , rendered.

the content of these tabs expensive create every time when user moves between tabs(kind off).

question: should implemented tab panel , not alter url(not utilize link-to, actions) when user clicks on these links , showing/hiding content? or

should done url way? if yes, there way create ember not destroy rendered template in outlet?

thanks

at time can not maintain views/components rendered when route change. can render beforehand , switch between using ember query params. take @ http://emberjs.com/guides/routing/query-params/ , https://github.com/instructure/ic-tabs

ember.js