- We've got all of the elements of a really good…Angular application with multiple routes,…and, so, let's go ahead and enhance things a bit.…I'm going to add some navigation that we can use…to cycle through our artists array.…And I'm going to do that with just…traditional JavaScript.…So, there's no reason you can't combine a little Angular…with JavaScript.…Angular is plain, old JavaScript with some enhancements,…so you can use what you already know…to enhance your applications.…So, let's go ahead and first,…right here, in this partial,…we're going to add just some navigation elements.…

We'll create an anchor tag with a class of btn,…and btn-left.…That's just a couple of classes that I've created…to make this look like buttons.…And here our a href will be…the path details,…and then a variable that we'll be creating in JavaScript,…called prevItem.…And then, as a link, we will put a < here.…And then, I'm going to make a copy of this one.…

And, of course, then we're going to go to nextItem,…and this will be a >.…And then, let's go ahead and save this.…

Resume Transcript Auto-Scroll

Author

Released

3/25/2014

Get a fresh look at AngularJS, a "superheroic" framework for building single-page web applications fast. Ray Villalobos shows you how to understand the practical uses of AngularJS with a directory search project—a traditional type of web app you can add to your existing sites. He defines the MVC architecture underlying AngularJS: the model (your data), views (how data is flowed into your template), and controllers (the JavaScript that links the two together). You then learn how to divide your project into modules; work with services like $http, $routeProvider, and animation; and set up deep linking and navigation. Start now, and learn the simple way to build your own complex web application.

Topics include:

What is AngularJS?

Working with complex models

Using a the $http service to read a JSON file

Binding data

Dividing your app into partials

Creating a details template

Using AngularJS animation events

Skill Level Intermediate

1h 20m

Duration

1,076,440

Views

Show MoreShow Less

Q: This course was updated on 12/11/2015. What changed?

A: We updated two movies ("Creating our details template"
and "Adding navigation to our details page") to reflect changes to AngularJS 1.4.8 and the 1.5 beta.

Skills covered in this course

Course Retiring Soon

Learning AngularJS 1 (2014) will be retired from the lynda.com library on February 23rd, 2018. Training videos and exercise files will no longer be available, but the course will still appear in your course history and certificates of completion. For updated training, check out Learning AngularJS 1 in the lynda.com Online Training Library.

Continue Assessment

You started this assessment previously and didn't complete it. You can pick up where you left off, or start over.