Skip to content

Instantly share code, notes, and snippets.

View boneskull's full-sized avatar
💀

Christopher Hiller boneskull

💀
View GitHub Profile
@boneskull
boneskull / gist:3138069
Created July 18, 2012 18:56
angular directive to fadeIn/hide
/**
* Fades an element in when the model changes. Restricted to attributes.
*
* Usage:
*
* <div di-fade-in="foo"/>
*/
di.directive('diFadeIn', function () {
return {
@boneskull
boneskull / gist:3239476
Created August 2, 2012 18:32
directive to fade in a node
// <div fade-in="some_boolean">BOOM</div>
myApp.directive('fadeIn', function() {
return {
restrict: 'A',
link: function(scope, element, attribs) {
scope.$watch(attribs.fadeIn, function(value) {
if (value) {
element.fadeIn();
} else {
@boneskull
boneskull / gist:3372452
Created August 16, 2012 18:33
directive to prevent the default event action from occurring
/**
* preventDefault: prevents the default action of the event from occurring. This is useful if
* you are using anchor tags and hash routing, wherein you do not want the anchor click to screw
* with your hashes.
*
* Usage:
*
* <a href="#" prevent-default="click">click me</a>
*/
myModule.directive('preventDefault', function () {
@boneskull
boneskull / gist:4993082
Created February 20, 2013 05:13
redefine certain directives to update model on blur instead of keydown
/*global angular*/
/**
* Include this module if you want text boxes to update on blur instead of on keydown/input/change.
*/
(function () {
'use strict';
var blur = angular.module('decBlurModel', []);
@boneskull
boneskull / gist:5526758
Last active December 17, 2015 01:10
This shows how you can use arbitrary attributes within a directive.
<html>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.3/angular.min.js"></script>
<script type="text/javascript">
var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.name = 'Superhero';
}
@boneskull
boneskull / formdata.ctrl.js
Last active December 17, 2015 01:30
FormData factory to transform your requests
$scope.submit = function submit() {
return $http({
method: 'POST',
url: '/your/url',
headers: {
'Content-Type': 'multipart/form-data'
},
data: {
file: $scope.file
},
var myApp = angular.module('myApp', []);
myApp.controller('MyCtrl', ['$scope', function($scope) {
$scope.addTwo = function(n) {
return n + 2;
};}]);
myApp.service('MyService', function() {
this.addThree = function(n) {
return n + 3;
@boneskull
boneskull / gist:6011707
Created July 16, 2013 19:13
Example of service inheritance
var myApp = angular.module('myApp', []);
var baseService = function () {
this._state = {};
};
baseService.prototype.getState = function () {
return this._state;
};
baseService.prototype.setState = function (state) {
this._state = state;
@boneskull
boneskull / gist:6127098
Last active December 20, 2015 11:59
Potentially useless and harmful example of coercing a jQuery $.Deferred out of AngularJS' $q. See http://jsfiddle.net/boneskull/TX7fA/
var myApp = angular.module('myApp', []);
$(function () {
var body = $('body'),
injector = body.injector(),
giveMeJQueryPromise = function ($log, $timeout) {
var dfrd = $.Deferred();
$log.log('deferring');
$timeout(angular.noop, 2000).then(function () {
dfrd.resolve('deferred');
@boneskull
boneskull / angular-ui-0.3.1.js
Created August 7, 2013 21:48
cobbled together uiSelect2 to work with ngOptions
/**
* Enhanced Select2 Dropmenus
*
* @AJAX Mode - When in this mode, your value will be an object (or array of objects) of the data used by Select2
* This change is so that you do not have to do an additional query yourself on top of Select2's own query
* @params [options] {object} The configuration options passed to $.fn.select2(). Refer to the documentation
*/
angular.module('ui.directives').directive('uiSelect2', ['ui.config', '$timeout', '$parse', function (uiConfig, $timeout, $parse) {
var options = {};
if (uiConfig.select2) {