Angular UI Bootstrap – Pagination Directive Check out UI Bootstrap’s pagination directive. I ended up using it rather than what is posted here as it has enough features for my current use and has a thorough test spec to accompany it. View <!– table here –> <pagination ng-model=”currentPage” total-items=”todos.length” max-size=”maxSize” boundary-links=”true”> </pagination> <!– items/page select … Read more
I tweaked this answer a bit and came up with this fiddle. Filter defined as: var myApp = angular.module(‘myApp’, []); myApp.filter(‘range’, function() { return function(input, total) { total = parseInt(total); for (var i=0; i<total; i++) { input.push(i); } return input; }; }); With the repeat used like this: <div ng-repeat=”n in [] | range:100″> do … Read more
I feel that other answers, while correct, don’t quite explain the root of the question: REST is a subset of HTTP. This means everything that can be done via REST can be done via HTTP but not everything that can be done via HTTP can be done via REST. That is why $resource uses $http … Read more
We can use the angular.element(document).ready() method to attach callbacks for when the document is ready. We can simply attach the callback in the controller like so: angular.module(‘MyApp’, []) .controller(‘MyCtrl’, [function() { angular.element(document).ready(function () { document.getElementById(‘msg’).innerHTML = ‘Hello’; }); }]); http://jsfiddle.net/jgentes/stwyvq38/1/
For those receiving this warning for the first time, it is due to a bleeding edge feature called Passive Event Listeners that has been implemented in browsers fairly recently (summer 2016). From https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md: Passive event listeners are a new feature in the DOM spec that enable developers to opt-in to better scroll performance by eliminating … Read more
This is the most comprehensive AngularJS learning resource repository I’ve come across: AngularJS-Learning To pluck out the best parts (in recommended order of learning): http://www.egghead.io/ – Series of short, to the point AngularJS videos AngularJS Cheatsheet – regularly updated cheatsheet [latest update 13th February, 2013] On nested scopes – Points out possible problems when using … Read more
What a great question! I’d love to hear what others have to say, but here are the guidelines I use. The high-altitude premise: scope is used as the “glue” that we use to communicate between the parent controller, the directive, and the directive template. Parent Scope: scope: false, so no new scope at all I … Read more
The angular.forEach loop can’t break on a condition match. My personal advice is to use a NATIVE FOR loop instead of angular.forEach. The NATIVE FOR loop is around 90% faster then other for loops. USE FOR loop IN ANGULAR: var numbers = [0, 1, 2, 3, 4, 5]; for (var i = 0, len = … Read more
Use nested inline if-then statements (Ternary Operators) <div ng-class=” … ? ‘class-1’ : ( … ? ‘class-2’ : ‘class-3’)”> for example : <div ng-class=”apt.name.length >= 15 ? ‘col-md-12’ : (apt.name.length >= 10 ? ‘col-md-6’ : ‘col-md-4′)”> … </div> And make sure it’s readable by your colleagues 🙂
To remove item you need to remove it from array and can pass bday item to your remove function in markup. Then in controller look up the index of item and remove from array <a class=”btn” ng-click=”remove(item)”>Delete</a> Then in controller: $scope.remove = function(item) { var index = $scope.bdays.indexOf(item); $scope.bdays.splice(index, 1); } Angular will automatically detect … Read more