Beginning AngularJS

Chapter 8 ■ Organizing Views app.controller('notFoundController', function ($scope) { $scope.message = 'There seems to be a prob ...

Chapter 8 ■ Organizing Views Route parameters are much more flexible than the fixed, or static, routes that we have seen so far. ...

Chapter 8 ■ Organizing Views The second segment in this route acts as a reference to whatever value is actually supplied as the ...

Chapter 8 ■ Organizing Views Listing 8-16. The Revised Routes Configuration app.config(function ($routeProvider) { // configure ...

Chapter 8 ■ Organizing Views Figure 8-4. The updated about.html view template Figure 8-5. The updated contact.html view template ...

Chapter 8 ■ Organizing Views Eager vs. Conservative Routes Routes such as '/contact/:subject' are known as conservative routes. ...

Chapter 8 ■ Organizing Views One particularly interesting alternative is the template option (see Listing 8-17). It’s similar to ...

Chapter 8 ■ Organizing Views Of course, there’s probably not much point in using the function-based alternative in this example. ...

Chapter 8 ■ Organizing Views Summary Organizing your view templates isn’t too difficult, but it can require some planning and fa ...

Chapter 9 AngularJS Animation Animating your page element can be fun, but it can be easy to get carried away. Of course, you sho ...

Chapter 9 ■ angularJS animation A page listing various Angular modules appears. You want to download the angular-animate.js file ...

Chapter 9 ■ angularJS animation Transforms You can transform a web page element in several ways: you can rotate it, scale it, mo ...

Chapter 9 ■ angularJS animation This effect is surprisingly easy to accomplish. Figure 9-2 shows what it looks like in a web bro ...

Chapter 9 ■ angularJS animation ■ Tip You can learn more about SaSS at http://sass-lang.com/. Stylus is a good alternative to Sa ...

Chapter 9 ■ angularJS animation .navButton:hover { width: 110px; background-color: green; color: #ffffff; } Home About Us ...

Chapter 9 ■ angularJS animation padding: .3em; background-color: orange; color: #000000; transition: all .5s; } .navButton:hover ...

Chapter 9 ■ angularJS animation Applying Animations You don’t work directly with the $animate service when applying animations i ...

Chapter 9 ■ angularJS animation The controller doesn’t do very much at all, aside from setting a simple Boolean variable named o ...

Chapter 9 ■ angularJS animation ■ Note the supported directives will only make use of these classes if the ngAnimate module is p ...

Chapter 9 ■ angularJS animation none Through the ngInclude directive, Listing 9-5 also makes use of two included cont ...