Hey guys, I'm loving using the one time binding on expressions in 1.3 beta right now. I'm sure you've thought about the use case to trigger some sort of recompile of those templates. I like to know what you're thinking and share a directive that I built <http://kent.doddsfamily.us/kcd-angular/#/kcd-recompile> that's intended to solve this problem. Let me know what you think and what I can do to help :-)
P.S. If you don't care to go to that link, here's what it says: kcd-recompile directive Dependencies: $compile <https://docs.angularjs.org/api/ng/service/$compile> , $parse <https://docs.angularjs.org/api/ng/service/$parse> Docs With the advent of one-time binding expressions <https://docs.angularjs.org/guide/expression#one-time-binding> in Angular 1.3, I want to use it all over the place to lower my watch count <https://github.com/kentcdodds/ng-stats>. The problem is sometimes you actually do want to recompile a template if data does change and the one-time binding doesn't do this for you. By placing this simple directive on an element a watch is added to the value of kcd-recompile and the element and all of its children will be recompiled when that value is set to a non-falsey (and not === 'false') value (and then the value will be reset to false when recompilation is complete). *Note:* Because this directive adds a watch, it's best suited for when you have more than one expression, or the expression you would otherwise be watching makes your digest cycle take longer (like an expression that calls a function that makes some kind of calculation). Watches run *all the time*, so if you're not careful they can slow down your app. Hopefully this is helpful for allowing you to control when a template is recompiled and take advantage of the one-time binding 1.3 will give us. Usage: <div ng-repeat="thing in ::things" kcd-recompile="recompile.things"> <img ng-src={{::thing.getImage()> <span>{{::thing.name}}</span></div> $scope.recompile = { things: false }; $scope.$on('things.changed', function() { // or some other notification mechanism that you need to recompile... $scope.recompile.things = true; }); ------------------------------ Code angular.module('kcd.directives').directive('kcdRecompile', function($compile, $parse) { 'use strict'; function getElementAsHtml(el) { // http://jsperf.com/jquery-div-vs-span return angular.element('<a></a>').append(el.clone()).html(); } return { compile: function(el) { var template = getElementAsHtml(el); return function link(scope, $el, attrs) { scope.$watch(attrs.kcdRecompile, function(val) { if (!val || val === 'false') { return; } // recompile var newEl = $compile(template)(scope); $el.replaceWith(newEl); $el = newEl; // reset kcdRecompile to false $parse(attrs.kcdRecompile).assign(scope, false); }); }; } }; }); -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
