Using Ember Data

Using Ember Data Currently, our app is using hard-coded data for rentals in the rentals route handler to set the model. As our application grows, we will want to be able to create new rentals, make updates to them, delete them, and save these changes to a backend server. Ember integrates with a data management library called Ember Data to help solve this problem. Let's generate our first Ember Data model called rental: ember g model rental This results in the creation of a model file and a t

Using Block Params

Using Block Params Components can have properties passed in (Passing Properties to a Component), but they can also return output to be used in a block expression. Return values from a component with yield app/templates/index.hbs {{blog-post post=model}} app/templates/components/blog-post.hbs {{yield post.title post.body post.author}} Here an entire blog post model is being passed to the component as a single component property. In turn the component is returning values using yield. In this

Unit Testing Basics

Unit Testing Basics Unit tests are generally used to test a small piece of code and ensure that it is doing what was intended. Unlike acceptance tests, they are narrow in scope and do not require the Ember application to be running. As it is the basic object type in Ember, being able to test a simple Ember.Object sets the foundation for testing more specific parts of your Ember application such as controllers, components, etc. Testing an Ember.Object is as simple as creating an instance of th

Troubleshooting

Troubleshooting Below are some common issues you may encounter when using the Inspector, along with the necessary steps to solve them. If your issue is not listed below, please submit an issue to the Inspector's GitHub repo. Ember Application Not Detected If the Inspector cannot detect an Ember application, you will see the following message: Some of the reasons this may happen: This is not an Ember application You are using an old Ember version ( < 1.0 ). You are using a protocol other t

Triggering Changes with Actions

Triggering Changes with Actions You can think of a component as a black box of UI functionality. So far, you've learned how parent components can pass attributes in to a child component, and how that component can use those attributes from both JavaScript and its template. But what about the opposite direction? How does data flow back out of the component to the parent? In Ember, components use actions to communicate events and changes. Let's look at a simple example of how a component can us

Transition#trigger()

trigger (ignoreFailure, name) public Defined in bower_components/router.js/lib/router/transition.js:248 Fires an event on the current list of resolved/resolving handlers within this transition. Useful for firing events on route hierarchies that haven't fully been entered yet. Note: This method is also aliased as send Parameters: ignoreFailure [Boolean] a boolean specifying whether unhandled events throw an error name String the name of the event to fire

Transition#then()

then (onFulfilled, onRejected, label) Promisepublic Defined in bower_components/router.js/lib/router/transition.js:135 A standard promise hook that resolves if the transition succeeds and rejects if it fails/redirects/aborts. Forwards to the internal promise property which you can use in situations where you want to pass around a thennable, but not the Transition itself. Parameters: onFulfilled Function onRejected Function label String optional string for labeling the promise. Us

Transition#retry()

retryTransitionpublic Defined in bower_components/router.js/lib/router/transition.js:207 Retries a previously-aborted transition (making sure to abort the transition if it's still active). Returns a new transition that represents the new attempt to transition. Returns: Transition new transition

Transition#promise

promise{Object}public Defined in bower_components/router.js/lib/router/transition.js:108 The Transition's internal promise. Calling .then on this property is that same as calling .then on the Transition object itself, but this property is exposed for when you want to pass around a Transition's promise, but not the Transition object itself, since Transition object can be externally aborted, while the promise cannot.

Transition#method()

method (method) Transitionpublic Defined in bower_components/router.js/lib/router/transition.js:223 Sets the URL-changing method to be employed at the end of a successful transition. By default, a new Transition will just use updateURL, but passing 'replace' to this method will cause the URL to update using 'replaceWith' instead. Omitting a parameter will disable the URL change, allowing for transitions that don't update the URL at completion (this is also used for handleURL, since the URL