Ben Nadel
On User Experience (UX) Design, JavaScript, ColdFusion, Node.js, Life, and Love.
I am the chief technical officer at InVision App, Inc - a prototyping and collaboration platform for designers, built by designers. I also rock out in JavaScript and ColdFusion 24x7.
Meanwhile on Twitter
Loading latest tweet...
Ben Nadel at CFUNITED 2010 (Landsdown, VA) with:

Recent Blog Posts by Ben Nadel

Monkey-Patching The $q Service Using $provide.decorator() In AngularJS

By Ben Nadel on January 30, 2015

This morning, I posted a blog post on monkey-patching the $q service to include an .fcall()-inspired method for function execution in a Promise chain . After posting it, Tomasz Stryjewski and Phil DeJarnett both pointed out that my use of the .run() block was a poor choice when it came to serv... read more »

Monkey-Patching The $q Service With .fcall() In AngularJS

By Ben Nadel on January 30, 2015

Yesterday, I looked at the pitfalls of starting an AngularJS promise-chain if the promise-generating method might throw an error . In that post, I solved the problem by wrapping the initial method inside a .then() callback; but, what I'd really like is a method akin to .fcall() in the Q-promise li... read more »

Handling Top-Level Errors In A Promise Workflow In AngularJS

By Ben Nadel on January 29, 2015

In yesterday's post, on asynchronous promise workflows in AngularJS , all of my state transformation was done with explicit return values. As such, you didn't see the fact that the .then() method implicitly handles exceptions by transforming them into a rejected state. But, this feature got me thi... read more »

Exploring Asynchronous Promise-Based Workflows In AngularJS

By Ben Nadel on January 28, 2015

At InVision , we're going to start using a lot more Node.js to build out micro-services. And, while I love JavaScript, the vast majority of my server-side code has dealt with the synchronous, blocking nature of ColdFusion . As such, I feel like I need to start exploring more asynchronous workflow... read more »

Defining Post-Route-Change Scroll Behavior Using $location in AngularJS

By Ben Nadel on January 26, 2015

Over the weekend, I described my evolving thoughts on the use of $location in a route-driven AngularJS application . And, while I think that the post was accurate from a technical standpoint, I believe it failed to capture the actual workflow of $route / $location consumption in a complex user int... read more »

$route Must Be Injected In Order To Enable The $routeChangeSuccess Event In AngularJS

By Ben Nadel on January 24, 2015

Earlier, when I was exploring the use of the $location service to provide state-transformation triggers in AngularJS , I noticed something interesting about the $route service; the $routeChangeSuccess event won't fire until at least one component in the application has required the $route service.... read more »

Providing State-Transformation Triggers Using $location In AngularJS

By Ben Nadel on January 24, 2015

When I first started using routes, nested views, and deep linking in AngularJS , I thought that everything in the URL had to be related to the route. As such, I rarely ever used the $location service, except to change the path in order to trigger a new route-change event. Over time, however, I cam... read more »

Staggering ngRepeat Animations In AngularJS

By Ben Nadel on January 22, 2015

Lately, I've been trying to learn more about the new animation features of the ngAnimate module available as of AngularJS 1.2. In my reading, I saw mention of the ability to "stagger" animations. As someone who has a love-hate relationship with user interface (UI) transitions , this struck me as... read more »

Watching A Collection Of Expressions Using Scope.$watchGroup() In AngularJS

By Ben Nadel on January 21, 2015

Since the early days, AngularJS has provided us with the Scope.$watch() method as a means to observe changes in the View-Model. Then, they added the Scope.$watchCollection() to perform a shallow-watch or arrays . Now, in AngularJS 1.3, they've added Scope.$watchGroup(). This new method watches a c... read more »

Stateless Filters Don't Apply To Objects, Arrays, or ngRepeat In AngularJS 1.3

By Ben Nadel on January 20, 2015

In the past, I have talked about my dislike for Filters in AngularJS. Not only do they have a performance concern, they also make it harder to manage the state of the View as filtering is applied to collections (ex, ngRepeat). The other day, after some filter-based frustration (with someone else's ... read more »

Preventing Animation During The Initial Render Of ngRepeat In AngularJS

By Ben Nadel on January 18, 2015

As of AngularJS 1.2, directives that conditionally include content have also supported "enter" and "leave" style animations (with the help of the ngAnimate module). For most of these directives - like ngIf, ngInclude, and ngSwitch - animating the "enter" state makes a lot of sense. But, with ngRepe... read more »

ColdFusion 11 Accepts All Top-Level Domains (TLD) For IsValid() Email Validation

By Ben Nadel on January 17, 2015
Tags: ColdFusion

The other day, one of my users was having trouble changing his email address because he was using the ".marketing" top-level domain (TLD). In production, we still run ColdFusion 9, which has historically had problems with isValid( "email" ) . I know I'm a bit behind in the ColdFusion times, so I w... read more »

Binding Multiple ngSwitchWhen Cases To The Same Value In AngularJS

By Ben Nadel on January 16, 2015

Earlier this morning, when I was looking into the priority changes for ngSwitchWhen in AngularJS 1.3 , I noticed something odd - the ngSwitchWhen directive was "pushing" its transclusion function onto an array. In AngualrJS 1.0.8, this operation was a straight assignment. It seems that as of Angul... read more »

ngSwitchWhen Priority Is Higher Than ngRepeat Priority In AngularJS 1.3

By Ben Nadel on January 16, 2015

This is a really minor post about a change in directive priority in AngularJS 1.3. The other day, in my post about using multiple templates in a single ngRepeat directive , Boris Litvinsky brought it to my attention that ngSwitchWhen now executes at a higher priority (1,200) than the ngRepeat dire... read more »

AngularJS Pro-Tip: Be Mindful Of HTML Attribute Ordering

By Ben Nadel on January 15, 2015

When it comes to programming, I absolutely believe that the more mindful you are about your choices, the better you will become at programming over time. In AngularJS, one small aspect of the code that can benefit from mindfulness is the ordering of HTML attributes in your templates. In this post, ... read more »

One-Time Data Bindings For Object Literal Expressions In AngularJS 1.3

By Ben Nadel on January 14, 2015

Yesterday, I took a look at the new one-time data bindings introduced in AngularJS 1.3 . In that post, I was applying one-time data bindings to simple expressions (for lack of a better term). Today, I wanted to see how those same one-time data bindings would behave when watching object-literal ex... read more »

Exploring One-Time Bindings In AngularJS 1.3

By Ben Nadel on January 13, 2015

When I first starting reading about one-time data bindings in AngularJS 1.3, it wasn't immediately clear to me how they worked or how to use them. When I finally took a look at the source code last night, it finally clicked: one-time bindings aren't a "single thing." Rather, it's the interplay betw... read more »

Creating A Pre-Bootstrap Loading Screen In AngularJS

By Ben Nadel on January 12, 2015

As your AngularJS applications get bigger, you may start to notice that the apps don't bootstrap immediately - it takes time to load all the scripts over the network. Out of the box, AngularJS deals with this by providing an ngCloak directive which will hide pre-compiled HTML. But that's kind of a ... read more »

Creating An HTML-Based Select Menu In AngularJS Using ngModel And ngModelController

By Ben Nadel on January 10, 2015

Yesterday, I took my first look at building custom input controls with ngModel and ngModelController in AngularJS . While it's a two-way data binding mechanism at its core, the benefits of using ngModel appear to be many. Not only does it encapsulate the monitoring of the View-Model, it also integ... read more »

Experimenting With ngModel And ngModelController In AngularJS

By Ben Nadel on January 9, 2015

For the last few years, I've happily consumed the ngModel directive, in AngularJS; but, I've never really thought much about what it does - it just worked. But, ngModel does a lot - way more than I actually use it for, currently. After listening to the Form Validation episode of Adventures in Angu... read more »

Link Function And $watch() Callback Timing In AngularJS Directives

By Ben Nadel on January 6, 2015

Have you ever expected ngRepeat items to be on a page, but found that the given container is empty when you query it? If so, you're not alone. The timing of link functions and related $watch() callbacks, in AngularJS directives, can be a bit tricky; furthermore, the order of invocation can change d... read more »

Event Delegation Performance vs. Linking Performance In AngularJS

By Ben Nadel on January 5, 2015

In the past, I've talked about deferring DOM (Document Object Model) tree transclusion, in AngularJS, as a means to boost performance . Deferring transclusion can help, on large collections, because it cuts down on the number of active $watch() bindings . But, how much of that performance gain ca... read more »

Creating jqLite Plugins In AngularJS

By Ben Nadel on December 31, 2014

Yesterday, I looked at how jQuery is integrated with AngularJS and, what that means for developers who want to leverage jQuery within their AngularJS directives. This got me thinking about plugins. Many of us are used to writing jQuery plugins; but, what if we don't want to include jQuery? Can we... read more »

Using jQuery Instead Of jqLite In AngularJS

By Ben Nadel on December 30, 2014

Out of the box, AngularJS provides jqLite, which is a jQuery-like library that provides a subset of jQuery functionality. If you include jQuery in your page, however, AngularJS will use jQuery instead of jqLite when wrapping elements within your directives. Until recently, however, I had only ever ... read more »

Scope.$applyAsync() vs. Scope.$evalAsync() in AngularJS 1.3

By Ben Nadel on December 29, 2014

A while back, I looked at using the Scope.$evalAsync() method as a means to execute code asynchronously within an AngularJS context without using the $timeout() service. In AngularJS 1.3, they've added a new Scope method - Scope.$applyAsync(). After reading the documentation, the difference betwe... read more »

Injecting Sibling Nodes During The Compilation Phase Of AngularJS Directives

By Ben Nadel on December 28, 2014

Typically, the compilation phase of an AngularJS directive deals with altering the contents of the current DOM (Document Object Model) node. However, in edge-cases, you may need to replace the current DOM node or inject a new sibling node. Sibling nodes are funny - sometimes injecting them is safe;... read more »

Passing $q Defer Methods Around As Naked Function References In AngularJS

By Ben Nadel on December 27, 2014

A few years ago, I noticed that the Deferred object methods, in jQuery, could be passed around as naked function references . Meaning, instead of passing around a closure that acted upon a deferred instance, I could simply pass around a reference to the "resolve" function. The AngularJS documentat... read more »

Compiling Transcluded Content in AngularJS Directives

By Ben Nadel on December 26, 2014

When you use the "transclude" option, in an AnglarJS directive, the transcluded content is automatically removed from its container, compiled, and made available through a linking function. This process keeps the transcluded content completely black-boxed. However, if we need to explicitly compile ... read more »

Accidentally Defining A Directive Twice In AngularJS

By Ben Nadel on December 23, 2014

Over the last two months, I've tried to demonstrate how powerful it is that AngularJS allows you to bind a single directive to multiple compilation and linking functions . Not only does this allow you to bind to different priorities on the same element , it also allows you to share elements, lik... read more »

The "Post-Link" Function Is The "Link" Function In AngularJS Directives

By Ben Nadel on December 22, 2014

In AngularJS, directives are both powerful and complicated. Understanding them is not a one-time thing; it's a process that requires iteration and experimentation. The documentation is great; but, it will only take you so far. One thing that I wanted to clarify, that I personally find confusing in ... read more »