Code Monkey home page Code Monkey logo

angular_exercises's Introduction

More Angular Practice

Before you start, think about some of the built in angular directives and topics you have learned about:

ng-app
ng-model
ng-show
ng-hide
ng-style
ng-class
ng-pluralize
ng-repeat
ng-show
ng-hide
filters (orderBy, limitTo)
custom filters

Objectives

  1. Create a new rails app and include angular in your application. You can do this by including the angular-gem or cdn.

  2. Create a rails controller and template to render a basic home page.

  3. Create your app and controller in an app.js or app.js.coffee file.

  4. Create an array of objects called favoriteMovies and use the ng-repeat directive to iterate over the array of favoriteMovies.

  5. Filter your ng-repeat of movies and order them by name and limit the number displayed to 3.

  6. Create a custom filter to reverse the letters of the title of your favorite movies.

  7. Write a function called removeFavorite that removes a favorite movie from your array.

  8. Include the text "I have {{favoriteMovies.length}} favorite(s)" and use ng-pluralize so that the text displays favorite when there is 1 movie and favorites in all other cases.

  9. Add a checkbox that allows the user to see the list of favorite movies when checked and hides the list of movies when unchecked.

Bonus:

  1. Write this all in CoffeeScript!

angular_exercises's People

Contributors

elie avatar tlicata avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.