Learn
Great! A gallery of images shows up. How does it work?
- In app.js inside the
app.config()
method, we use Angular’s$routeProvider
to define the application routes. - We used
.when()
to map the URL/
to to the controllerHomeController
and the templatehome.html
. TheHomeController
uses the service js/services/photos.js to fetch the array of all photos from https://content.codecademy.com/courses/ltp4/photos-api/photos.json and stores it into$scope.photos
. Thehome.html
usesng-repeat
to loop through each item in thephotos
array and display each photo. - Otherwise if a user accidentally visits a URL other than
/
, we just redirect to/
using.otherwise()
. - Now when a user visits
/
, a view will be constructed by injectinghome.html
into the<div ng-view></div>
in index.html.
Instructions
1.
In app.js between the .when()
and .otherwise()
, add another .when()
that maps the URL /photos/:id
to the controller PhotoController
and the template views/photo.html.
2.
Visit http://localhost:8000/ and click on a photo. A detail page about that photo should appear.
Take this course for free
By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.