GitHub - aeisenberg/angular-bind-notifier: On demand refreshing of AngularJS bindings. Vast performance improvements on complex apps. (original) (raw)

angular-bind-notifier

On-demand & semi-automatic re-evaluation of angular one-time bindings

'ok' examples @ gh-pages

installation

bower install angular-bind-notifier --save jspm install angular-bind-notifier --save npm install angular-bind-notifier --save

description

This package is meant for those looking for a middleground between two way binding, and one time bindings. someTimeBinding?

Based off of the work done by @kseamon on fast-bind, a proposal from August 2014 on labeled bindings and @kasperlewau's bower port of fast-bind, designed to closely resemble the one-time double-colon syntax introduced with Angular 1.3.

The idea is to pass a set of key(s) between the first and second colon of a one-time expression.

Said key(s) will need to be pre-registered with a corresponding value, either by a bind-notifier directive or or a $Notifier instance, DI'd and coupled with your $scope.

Once a key's value changes, a broadcast will be sent down through the descendant scopes, letting each expression with the :key:expr syntax know that it is time to re-evaluate the result of the expression.

Possible use cases include but are not limited to;

Model data that changes seldomly, that then needs to be reflected in the view.
Translation(s) of the entire page (or a subsection), where static data needs to be re-translated.

Keys are determined by the following rules:

surrounded by : character
consists only of alphanumeric characters and -
cannot start with a -
is at the start of the binding or follows another key

For example: in :keyOne:key-2:3:variable | someFilter:true:10 the following are keys: keyOne, key-2, 3 and the remaining contents are the expression due to variable | someFilter not matching the rules of being a key

usage

// inject the module dependency angular.module('your_module_name', [ 'angular.bind.notifier' ]);

bind-notifier

jsbin example

$Notifier(scope, notifierMap)

jsbin example

The $Notifier factory returns a constructor function for you to setup a new $Notifier instance.

Both params ($scope & notifierMap) are required, a lack of either is considered a programmatical error and an error will be thrown.

.controller('...', function ($scope, $Notifier) { $scope.a = 'a'; $scope.b = 'b';

new Notifier(Notifier(Notifier(scope, { aNameSpace: 'a', bNameSpace: 'b' }); });

manual refreshment

jsbin example

The above use cases showcase how $watched expressions refresh bindings.

What happens behind the scenes is that a $broadcast is sent with the $$rebind:: prefix, followed by the key of your notifier key:value mapping.

As such, you can manually broadcastwheneveryouwanttorefreshthebinds−youdon′tneedtosetupasemi−automaticwatcherthrough‘bind−notifier‘or‘broadcast whenever you want to refresh the binds - you don't need to setup a semi-automatic watcher through bind-notifier or </annotation></semantics></math>broadcastwheneveryouwanttorefreshthebinds−youdon′tneedtosetupasemi−automaticwatcherthrough‘bind−notifier‘or‘Notifier.

scope.scope.scope.broadcast('$$rebind::' + 'superduper'); // binding: refreshed!

building/testing

npm install; npm install gulp -g
gulp [lint|test|test:browser]

GitHub - aeisenberg/angular-bind-notifier: On demand refreshing of AngularJS bindings. Vast performance improvements on complex apps. (original) (raw)

angular-bind-notifier

'ok' examples @ gh-pages

installation

description

usage

bind-notifier

$Notifier(scope, notifierMap)

manual refreshment

building/testing

license