how to render a complete new template and leave the application template in ember

I am new to ember and javascript.I have designed a homepage(application.hbs).Now there is a option (About us) in application.hbs which should redirect to about us page(completely new).How should I leave the the homepage completely and move to about us page.Right now it is displaying the content of about us page below the homepage(application.hbs).

application.hbs(code snippet)

<section id = "FollowUs">
  <div class = "follow container-fluid">
    <div class="row section_blurb"> 
     <div class="col-xs-12 col-sm-4">
        <h1>example</h1>
        <a href ="#terms"><p>Home</p></a>
        <a href ="#terms"><p>Contact</p></a>
        <p>{{#link-to "aboutus"}}About Us{{/link-to}}</p>
      </div>
      <div class="col-xs-12 col-sm-4">
        <h1>Dolor Sit Amet </h1>
        <a href ="#terms"><p>Term & Conditions</p></a>
        <a href ="#privacy"><p>Privacy Policy</p></a>
        <a href ="#terms"><p>Lorem Ipsum</p></a>
      </div>
      <div class="col-xs-12 col-sm-4">
        <h1>Contact</h1>
        <p>99999999999</p>
        <a href ="#privacy"><p>hello@gmail.com</p></a>  
      </div>
      <div class="col-sm-6">
        <h1>Follow Us</h1>
        <div class = "row">
          <div class="col-xs-4 col-sm-2 col-sm-offset-2">
            <a href = "http://ift.tt/g8FRpY"> 
               <img src="images/ic_facebook yellow.svg" class="img-responsive"></a>
          </div>
          <div class="col-xs-4 col-sm-2 col-sm-offset-2">  
            <a href = "https://twitter.com/">
               <img src="images/ic_twitter yellow.svg" class ="img-responsive"></a>  
          </div>
          <div class="col-xs-4 col-sm-2 col-sm-offset-2">      
            <a href = "">
               <img src="../images/ic_google plus yellow.svg" class="img-responsive"></a>
          </div>
          <div class="col-xs-4 col-sm-2 col-sm-offset-2">     
            <a href = "#facebook">
               <img src="../images/ic_instagram yellow.svg" class="img-responsive"></a>
          </div>   
      </div>     
      </div>
      </div>
    </div>
</section>

router.js

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

var Router = Ember.Router.extend({
  location: config.locationType
});

Router.map(function() {
    this.route("aboutus");
});

export default Router;

aboutus.hbs

<p>hello</p>
{{outlet}}