Updated how we describe injecting Ember Data store

guides/release/models/index.md

@@ -186,8 +186,10 @@ first ask the store for it.
     <div class="cta-note-body">
       <div class="cta-note-heading">Zoey says...</div>
       <div class="cta-note-message">
-        Ember Data injects the store service in every route and controller,
-        so you can access it as `this.store`!
+        Ember Data injects the store service to every route and controller
+        so that you can immediately write <code>this.store</code>!
+        If you want to access the store in a component or another service,
+        you will need to <a href="../services/#toc_accessing-services">inject</a> the store service.
       </div>
     </div>
     <img src="/images/mascots/zoey.png" role="presentation" alt="">

guides/release/routing/specifying-a-routes-model.md

@@ -17,8 +17,11 @@ Here's an example of a model hook in use within a route:
 
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
+  @service store;
+
   model() {
     console.log('The model hook just ran!');
     return 'Hello Ember!';
@@ -125,20 +128,18 @@ identifier, instead):
 Ember Data is a powerful (but optional) library included by default in new Ember apps.
 In the next example, we will use Ember Data's [`findAll`](https://api.emberjs.com/ember-data/release/classes/Store/methods/findAll?anchor=findAll) method, which returns a Promise, and resolves with an array of [Ember Data records](../../models/).
 
-_Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/release/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/release/classes/Route/methods/model?anchor=model) hook._
-
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
-import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
-  @service store;
   model() {
     return this.store.findAll('posts');
   }
 }
 ```
 
+Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/release/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/release/classes/Route/methods/model?anchor=model) hook.
+
 ## Multiple Models
 
 What should you do if you need the `model` to return the results of multiple API requests?

guides/v3.15.0/models/index.md

@@ -186,8 +186,10 @@ first ask the store for it.
     <div class="cta-note-body">
       <div class="cta-note-heading">Zoey says...</div>
       <div class="cta-note-message">
-        Ember Data injects the store service in every route and controller,
-        so you can access it as `this.store`!
+        Ember Data injects the store service to every route and controller
+        so that you can immediately write <code>this.store</code>!
+        If you want to access the store in a component or another service,
+        you will need to <a href="../services/#toc_accessing-services">inject</a> the store service.
       </div>
     </div>
     <img src="/images/mascots/zoey.png" role="presentation" alt="">

guides/v3.15.0/routing/specifying-a-routes-model.md

@@ -17,8 +17,11 @@ Here's an example of a model hook in use within a route:
 
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
+  @service store;
+
   model() {
     console.log('The model hook just ran!');
     return 'Hello Ember!';
@@ -125,20 +128,18 @@ identifier, instead):
 Ember Data is a powerful (but optional) library included by default in new Ember apps.
 In the next example, we will use Ember Data's [`findAll`](https://api.emberjs.com/ember-data/3.15/classes/Store/methods/findAll?anchor=findAll) method, which returns a Promise, and resolves with an array of [Ember Data records](../../models/).
 
-_Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.15/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.15/classes/Route/methods/model?anchor=model) hook._
-
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
-import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
-  @service store;
   model() {
     return this.get('store').findAll('posts');
   }
 }
 ```
 
+Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.15/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.15/classes/Route/methods/model?anchor=model) hook.
+
 ## Multiple Models
 
 What should you do if you need the `model` to return the results of multiple API requests?

guides/v3.16.0/models/index.md

@@ -186,8 +186,10 @@ first ask the store for it.
     <div class="cta-note-body">
       <div class="cta-note-heading">Zoey says...</div>
       <div class="cta-note-message">
-        Ember Data injects the store service in every route and controller,
-        so you can access it as `this.store`!
+        Ember Data injects the store service to every route and controller
+        so that you can immediately write <code>this.store</code>!
+        If you want to access the store in a component or another service,
+        you will need to <a href="../services/#toc_accessing-services">inject</a> the store service.
       </div>
     </div>
     <img src="/images/mascots/zoey.png" role="presentation" alt="">

guides/v3.16.0/routing/specifying-a-routes-model.md

@@ -17,8 +17,11 @@ Here's an example of a model hook in use within a route:
 
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
+  @service store;
+
   model() {
     console.log('The model hook just ran!');
     return 'Hello Ember!';
@@ -125,20 +128,18 @@ identifier, instead):
 Ember Data is a powerful (but optional) library included by default in new Ember apps.
 In the next example, we will use Ember Data's [`findAll`](https://api.emberjs.com/ember-data/3.16/classes/Store/methods/findAll?anchor=findAll) method, which returns a Promise, and resolves with an array of [Ember Data records](../../models/).
 
-_Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.16/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.16/classes/Route/methods/model?anchor=model) hook._
-
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
-import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
-  @service store;
   model() {
     return this.get('store').findAll('posts');
   }
 }
 ```
 
+Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.16/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.16/classes/Route/methods/model?anchor=model) hook.
+
 ## Multiple Models
 
 What should you do if you need the `model` to return the results of multiple API requests?

guides/v3.17.0/models/index.md

@@ -186,8 +186,10 @@ first ask the store for it.
     <div class="cta-note-body">
       <div class="cta-note-heading">Zoey says...</div>
       <div class="cta-note-message">
-        Ember Data injects the store service in every route and controller,
-        so you can access it as `this.store`!
+        Ember Data injects the store service to every route and controller
+        so that you can immediately write <code>this.store</code>!
+        If you want to access the store in a component or another service,
+        you will need to <a href="../services/#toc_accessing-services">inject</a> the store service.
       </div>
     </div>
     <img src="/images/mascots/zoey.png" role="presentation" alt="">

guides/v3.17.0/routing/specifying-a-routes-model.md

@@ -17,8 +17,11 @@ Here's an example of a model hook in use within a route:
 
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
+  @service store;
+
   model() {
     console.log('The model hook just ran!');
     return 'Hello Ember!';
@@ -125,20 +128,18 @@ identifier, instead):
 Ember Data is a powerful (but optional) library included by default in new Ember apps.
 In the next example, we will use Ember Data's [`findAll`](https://api.emberjs.com/ember-data/3.17/classes/Store/methods/findAll?anchor=findAll) method, which returns a Promise, and resolves with an array of [Ember Data records](../../models/).
 
-_Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.17/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.17/classes/Route/methods/model?anchor=model) hook._
-
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
-import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
-  @service store;
   model() {
     return this.store.findAll('posts');
   }
 }
 ```
 
+Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.17/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.17/classes/Route/methods/model?anchor=model) hook.
+
 ## Multiple Models
 
 What should you do if you need the `model` to return the results of multiple API requests?

guides/v3.18.0/models/index.md

@@ -186,8 +186,10 @@ first ask the store for it.
     <div class="cta-note-body">
       <div class="cta-note-heading">Zoey says...</div>
       <div class="cta-note-message">
-        Ember Data injects the store service in every route and controller,
-        so you can access it as `this.store`!
+        Ember Data injects the store service to every route and controller
+        so that you can immediately write <code>this.store</code>!
+        If you want to access the store in a component or another service,
+        you will need to <a href="../services/#toc_accessing-services">inject</a> the store service.
       </div>
     </div>
     <img src="/images/mascots/zoey.png" role="presentation" alt="">

guides/v3.18.0/routing/specifying-a-routes-model.md

@@ -17,8 +17,11 @@ Here's an example of a model hook in use within a route:
 
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
+  @service store;
+
   model() {
     console.log('The model hook just ran!');
     return 'Hello Ember!';
@@ -125,20 +128,18 @@ identifier, instead):
 Ember Data is a powerful (but optional) library included by default in new Ember apps.
 In the next example, we will use Ember Data's [`findAll`](https://api.emberjs.com/ember-data/3.18/classes/Store/methods/findAll?anchor=findAll) method, which returns a Promise, and resolves with an array of [Ember Data records](../../models/).
 
-_Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.18/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.18/classes/Route/methods/model?anchor=model) hook._
-
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
-import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
-  @service store;
   model() {
     return this.store.findAll('posts');
   }
 }
 ```
 
+Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.18/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.18/classes/Route/methods/model?anchor=model) hook.
+
 ## Multiple Models
 
 What should you do if you need the `model` to return the results of multiple API requests?

guides/v3.19.0/models/index.md

@@ -186,8 +186,10 @@ first ask the store for it.
     <div class="cta-note-body">
       <div class="cta-note-heading">Zoey says...</div>
       <div class="cta-note-message">
-        Ember Data injects the store service in every route and controller,
-        so you can access it as `this.store`!
+        Ember Data injects the store service to every route and controller
+        so that you can immediately write <code>this.store</code>!
+        If you want to access the store in a component or another service,
+        you will need to <a href="../services/#toc_accessing-services">inject</a> the store service.
       </div>
     </div>
     <img src="/images/mascots/zoey.png" role="presentation" alt="">

guides/v3.19.0/routing/specifying-a-routes-model.md

@@ -17,8 +17,11 @@ Here's an example of a model hook in use within a route:
 
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
+  @service store;
+
   model() {
     console.log('The model hook just ran!');
     return 'Hello Ember!';
@@ -125,20 +128,18 @@ identifier, instead):
 Ember Data is a powerful (but optional) library included by default in new Ember apps.
 In the next example, we will use Ember Data's [`findAll`](https://api.emberjs.com/ember-data/3.19/classes/Store/methods/findAll?anchor=findAll) method, which returns a Promise, and resolves with an array of [Ember Data records](../../models/).
 
-_Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.19/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.19/classes/Route/methods/model?anchor=model) hook._
-
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
-import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
-  @service store;
   model() {
     return this.store.findAll('posts');
   }
 }
 ```
 
+Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.19/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.19/classes/Route/methods/model?anchor=model) hook.
+
 ## Multiple Models
 
 What should you do if you need the `model` to return the results of multiple API requests?

guides/v3.20.0/models/index.md

@@ -186,8 +186,10 @@ first ask the store for it.
     <div class="cta-note-body">
       <div class="cta-note-heading">Zoey says...</div>
       <div class="cta-note-message">
-        Ember Data injects the store service in every route and controller,
-        so you can access it as `this.store`!
+        Ember Data injects the store service to every route and controller
+        so that you can immediately write <code>this.store</code>!
+        If you want to access the store in a component or another service,
+        you will need to <a href="../services/#toc_accessing-services">inject</a> the store service.
       </div>
     </div>
     <img src="/images/mascots/zoey.png" role="presentation" alt="">

guides/v3.20.0/routing/specifying-a-routes-model.md

@@ -17,8 +17,11 @@ Here's an example of a model hook in use within a route:
 
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
+  @service store;
+
   model() {
     console.log('The model hook just ran!');
     return 'Hello Ember!';
@@ -125,20 +128,18 @@ identifier, instead):
 Ember Data is a powerful (but optional) library included by default in new Ember apps.
 In the next example, we will use Ember Data's [`findAll`](https://api.emberjs.com/ember-data/3.20/classes/Store/methods/findAll?anchor=findAll) method, which returns a Promise, and resolves with an array of [Ember Data records](../../models/).
 
-_Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.20/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.20/classes/Route/methods/model?anchor=model) hook._
-
 ```javascript {data-filename=app/routes/favorite-posts.js}
 import Route from '@ember/routing/route';
-import { inject as service } from '@ember/service';
 
 export default class FavoritePostsRoute extends Route {
-  @service store;
   model() {
     return this.store.findAll('posts');
   }
 }
 ```
 
+Note that Ember Data also has a feature called a [`Model`](https://api.emberjs.com/ember-data/3.20/classes/Model), but it's a separate concept from a route's [`model`](https://api.emberjs.com/ember/3.20/classes/Route/methods/model?anchor=model) hook.
+
 ## Multiple Models
 
 What should you do if you need the `model` to return the results of multiple API requests?