How to pass selected value between routes

I am quite new to the EmberJS, so please help me to understand and solve my problem.

This is my model: book.js

import DS from 'ember-data';

export default DS.Model.extend({
    title: DS.attr('string'),
    author: DS.attr('string'),
    picture: DS.attr('string'),
    buyer: DS.attr('string'),
    bought: DS.attr('boolean', { defaultValue: false }),
    createdAt: DS.attr('date', { defaultValue() { return new Date(); } })
});

I have the following route: Books.js

import Ember from 'ember';

export default Ember.Route.extend({
    model: function(){
        return this.store.findAll('book');
    }   
});

and a bit from corresponding books.hbs

        <div class="book-container col-xs-12 col-sm-6 col-md-4">
            <div class="card">
                <div class="wrapper">
                    <div class="details col-md-12">
                        <h3 class="product-title">Title </h3>
                        <p class="product-description">Author:</p>
                         Buy 
                    </div>
                </div>
            </div>
        </div>

This code returns all the books that I currently store in the app.

The idea is to get selected Book object from books.hbs and display it in give.hbs.

I wanted to use this line

Buy

to pass single a single book from books.hbs to give.hbs, but I don't know how to do that and if its the way to go..

In gift.hbs I partially invented a very inefficient way of doing it by looping all the books again and if the title is a match then display it...

  
    
      <h2><b></b></h2>
    
  

Obviously the "Harry Potter" string is hard coded but it could have been passed from books.hbs and that would do the trick since my data is relatively small.

If any Ember.js Guru could show me the proper way of doing that, that would be much appreciated.

Thanks