Listing items from one controller in another controller's template in Ember.js -

i'm making cocktail recipe app in ember, , i'd display list of existing ingredients inside template creating new recipe. here routes:

app.router.map(function() {   this.route('drinks', {path: '/drinks'});   this.route('drink', {path: '/drinks/:drink_id'});   this.route('newdrink', {path: '/drinks/newdrink'});   this.route('ingredients', {path: '/ingredients'});   this.route('ingredient', {path: '/ingredients/:ingredient_id'});   this.route('newingredient', {path: '/ingredients/new'}); }); 

here's template making new drink:

<script type="text/x-handlebars" id="newdrink">    <h3>create new drink.</h3>     <p>{{input type="text" classnames="form-control" placeholder="enter new drink." value=newdrinkname action="createdrink"}}</p>    <p>{{input type="text" classnames="form-control" placeholder="enter description." value=newdescription action="createdrink"}}</p>     <p>ingredients</p>    {{#each ingredient in ingredients}}      {{ingredientname}}<br />    {{/each}} </script> 

obviously, i'm missing here. how can pull list of ingredients database without nesting ingredients route inside drinks route?

first of routes should this:

app.router.map(function() {   this.resource('drinks', {path: '/drinks'}, function(){       this.resource('drink', {path: '/drink/:drink_id'});       this.route('newdrink', {path: '/newdrink'});   });    this.route('ingredients', {path: '/ingredients'}, function(){       this.resource('ingredient', {path: '/ingredient/:ingredient_id'});       this.route('newingredient', {path: '/new'});   }); }); 

now pulling data database - should done through model - , not through route/controller, meaning there should drink model, referencing ingredients through ember-data/ember-model's hasmany relation - such pulled db automatically.

app.drink = ds.model.extend({       name: ds.attr('string'),       ingredients: ds.hasmany('ingredient') }); app.ingredient = ds.model.extend({       name: ds.attr('string'),       drinks: ds.hasmany('drink') }); 

of course have define ajax interfaces/adapters these models. you'll able this:

app.drinksdrinkroute = ember.route.extend({     model: function(params) {         return this.store.find('post', params.drink_id);     } }); 

this make requested drink model template's controller, , make ingredients accessible in templates model.ingredients (or ingredients, depending on controller type).