The first thing we’ll do on the Ember side is list out all of our leads.
Everything always starts with routes. Open up your Ember Router and create a leads resource with the path set to root:
Next we need to fetch all lead records. Let’s create a
model is a hook that’s called whenever the route is entered. The result of the model function is then available to the controller, view, and template.
To be sure this is working properly, simply visit your root route and look at the “Data” tab in the Ember Inspector. You should see all of your leads.
Now that we have our leads we need to show them. Let’s create a template:
Now refresh the page and you should see your leads' listed on the left. Cool, right!?
Let’s create a property to display the leads' full names. Open the lead model and add it:
Then modify the template:
Our leads are not in any particular order. This is chaos! Let’s sort them by name.
You can sort arrays of models by specifying
sortProperties in the controller. We don’t have a controller yet, so let’s make one:
sortProperties takes an array of strings. These strings are the properties you want to sort by with the highest priority first.
Note that I’ve made this controller an
ArrayController. If you remember from the Controllers chapter, this is because the controller wraps an array of leads. Ember expects you to do this because
ArrayController defines certain things like
sortProperties that are not available on regular
Refresh the page and marvel at the beauty of your sorted leads.
Next we’ll show each lead’s data when when we click on it.