Category Archives: AngularJS

Socket.IO AngularJS Wrapper

I’ve been playing around with Socket.IO and AngularJS. To make things easier I created this service which can be used for transferring data between the client (which could be a web page) and a NodeJS server. The app is served by NodeJS so the Socket.IO server is listening on same location. ‘use strict’; angular .module(‘APP’) Continue Reading »

AngularJS Input Max Length Directive

In case you need to set a max length to a model binded input, well check this directive: ‘use strict’; angular .module(‘APP’) .directive(‘uiMaxlength’, function() { return { require: ‘ngModel’, link: function(scope, el, attrs, model) { var max_length = parseInt(attrs.uiMaxlength, 10); var input_value_parser = function(value) { if(value.length > max_length) { value = value.substring(0, max_length); model.$setViewValue(value); model.$render(); Continue Reading »

AngularJS Ng-Repeat In Range

AngularJS does not provide a way to create multiple copies of an element. Still this behavior is easy to achieve. Check the bellow filter which solves this problem: ‘use strict’; angular .module(‘APP’) .filter(‘range’, function() { return function(input, total) { total = parseInt(total, 10); for(var i=0; i<total; ++i) { input.push(i); } return input; }; }) ; Continue Reading »

AngularJS Custom Dropdown Time Filter

I’ve created this filter to allow hour selection using HTML dropdown. The filter accepts as input three paramers: the starting hour, the ending hour, and the minute interval. var app = angular.module(‘APP’, [‘APP.filters’]); app.controller(‘MainController’, [‘$scope’, function($scope) { }]); angular.module(‘APP.filters’, []).filter(‘time’, function() { return function(input, from, to, interval) { from = parseInt(from, 10); to = parseInt(to, Continue Reading »

AngularJS Cookie Service

In case you’re searching for a cookie service that can be used in AngularJS, here it is:   ‘use strict’ angular .module(‘APP.services’, []) .factory(‘Cookie’, function() { var self = this; self.set = function(name, value, days) { var expires = “”; if(days) { var date = new Date(); date.setTime(date.getTime()+(days*24*60*60*1000)); expires = “; expires=”+date.toGMTString(); } else { Continue Reading »

Load Google Maps Library on the fly

Define the service: ‘use strict’; angular .module(‘APP.services’) .factory(‘GMAPS’, [‘$window’, function($window) { var self = this, callback = null; $window.gmaps_loaded = function() { if(callback) { callback(); } }; self.load = function(cb) { if($window.google) { cb(); return; } callback = cb; var gmaps_script = $window.document.createElement(‘script’); gmaps_script.type = ‘text/javascript’; gmaps_script.src = ‘https://maps.googleapis.com/maps/api/js?v=3.exp&callback=gmaps_loaded&client=your_client_id’; $window.document.body.appendChild(gmaps_script); }; return { ‘load’: self.load Continue Reading »