AngularJs Mini Challenges

AngularJs Mini Challenges

What is AngularJs Mini Challenges

AngularJs Mini Challenges is a growing collection of "Challenges" about the most quirky parts of the AngularJs framework. It encourage you to find and fix common mistakes and subtle bugs, as well as performance issues and bad practices, that non-expert AngularJs programmers may encounter on their endeavours into the depths of the framework.

AngularJs Mini Challenges does not aim to teach you AngularJs. Former knowledge of the Framework is strongly recommended in order to understand the topics covered in this Challenges. In order to learn the basics of the Framework, please head over to this excellent book:



Book Tip

ng-book - The Complete Book on AngularJS
Ready to master AngularJS? What if you could master the entire framework – with solid foundations – in less time without beating your head against a wall?



The AngularJs target version for these challenges is 1.x.


Challenges (Phase one):

  1. Problem when using JS events in AngularJs.
  2. Scoping scope.
  3. How to reset scope data to initials value.
  4. Dependency injection issue when minify the js.
  5. Debugging Two ways, to see the content of an scope var.
  6. How to insert html into a view.
  7. Insert conditional css class in AngularJs .
  8. Focus on input field in AngularJS.
  9. How two controllers can communicate between each other .
  10. Prevent flicker when Angular route change until model gets loaded.

Challenges (Phase two):

  1. Prevent angular executing controller twice.
  2. How to use a filter in a controller.
  3. How to preventDefault on anchor tags in AngulatJs.
  4. ng-include not working.
  5. $scope.emit not working.
  6. How to access to the controller $scope from the console.
  7. How to avoid Angular ng-repeat Error “Duplicates in a repeater are not allowed.”
  8. Difference between the $observe and $watch methods.
  9. How can I iterate over the keys, value in ng-repeat in angular.
  10. We need to share data at global level, what we can use.

Challenges (Phase three):

  1. Angular JS ng-repeat handle empty list case.
  2. How to display length of filtered ng-repeat data.
  3. What's the most concise way to read query parameters in AngularJS?
  4. Prevent double curly brace notation from displaying momentarily before angular.js compiles/interpolates document.
  5. How can I call an AngularJS service from the console?
  6. Preload partial views before is requested in the route configuration.
  7. Removing the hashtag from AngularJS urls (# symbol).
  8. How to watch for a route change in AngularJS.
  9. ???

So far I have finished about the 33% of the intended total of challenges