Template Replacing History Entries

You can add entries to the browser’s history while moving between the routes by using the link-to helper and replace the current entry by using the replace=true option.

Syntax

{{#link-to 'link-text' 'route-name' replace = true}}
   //text here
{{/link-to}}

Example

The example shows how to replace the current entry in the browser’s history. Create a route with the name as info and open the router.js file to define the URL mappings −

import Ember from 'ember';
import config from './config/environment';

const Router = Ember.Router.extend ({
   location: config.locationType,
   rootURL: config.rootURL
});

Router.map(function() {
   this.route('info');
});

export default Router;

Open the file application.hbs file created under app/templates/ with the following code −

//put the replace = true option to replace the browser history entries
{{link-to 'Click For Fruits List' 'info' replace = true}}
{{outlet}}

When you click on “Click For Fruits List” link, page should open the info.hbs file, which contains the following code −

<ul>
   <li>Orange</li>
   <li>Banana</li>
</ul>
{{outlet}}

Output

Run the ember server; you will receive the following output −

Replace History

When you click on Click For Fruits List, it will display the following text from the template file −

Replace History

Previous Page:-Click Here

Leave a Reply