Tell your new directive to use the `product-gallery.html` template with the `templateUrl` attribute.
Give our `productGallery` directive all the gallery functionality that is currently inside our `GalleryController`. Make sure that you **do not** delete the `GalleryController` yet. We don't want to break the site.
Add the `controllerAs` attribute to your directive setting it to `gallery` so the directive knows what all the references to gallery in `product-gallery.html` are.
Put the gallery `section` inside of the provided `product-gallery.html`. Remove the `ng-controller` from the `section` inside the file once moved.
Now remove the image gallery `section` from `index.html` and the `GalleryController` from `app.js`.
Use our new `productGallery` directive where the gallery `section` used to be in our `index.html`.
5.2 initial file
5.2 initial file
Create a new Module named `store-directives` to encapsulate our store Directives.
Move the Directive definitions from `app.js` into `products.js`.
Give `gemStore` Module access to the directives by adding a dependency to `gemStore`'s definition.
Link in the new `products.js` file.
5.4 initial files
Pass our store controller the `$http` Service.
get the `store-products.json` using the `$http` Service.
Attach a `success` to our get call.
Attach a `success` to our get call (with a function(){}).
Name the first parameter of the success function `data`.
Give our `StoreController` access to the `products` by setting `products` equal to the data given to us with the http service's success promise.