AngularJS directive that enables creating 'nugets' - html sections that may be embedded in several places within your template.

nuget.js

define("directives/nuget", ["app"], function (app) {
    var nugets = [];

    return app.directive('nuget', [function () {
        return {
            restrict: "E",
            transclude: true,
            link: function (scope, elm, attrs, ctrl, transclude) {
                nugets.push({
                    name: attrs.name,
                    data: (attrs.data||"").split(','),
                    transclude: transclude
                });
            }
        };
    }]).directive('nuget', [function () {
        return {
            restrict: "A",
            link: function (scope, elm, attrs) {
                var nuget = nugets.filter(function (nugetI) {
                    return nugetI.name == attrs.nuget;
                })[0];

                var newScope = scope.$new();

                newScope.nugetData = nuget.data.reduce(function (map, attr) {
                    var value;
                    if (attr[0] == '*') {
                        attr = attr.slice(1);
                        value = scope.$eval(attrs[attr]);
                    }
                    else {
                        value = attrs[attr];
                    }
                    map[attr] = value;
                    return map;
                }, {});

                elm.replaceWith(nuget.transclude(newScope, function () {}));
            }
        };
    }]);
});

data attr sets comma seperated list of attributes that nuget can use. "*" before name means that the attribute value should be evaluated at scope level, other it is taken as a literal.

Usage: see very simple example at http://jsfiddle.net/srfrnk/f88mocLz/

<div ng-app="app" ng-init="ii=[1,2,3,4]">
    <nuget name="mynuget" data="name,*name1">
        <div>my nuget {{nugetData.name}} {{nugetData.name1+1}} {{i}}</div>
    </nuget>
    <div ng-repeat="i in ii">
        <div nuget="mynuget" name="my name" name1="i"></div>
        <div nuget="mynuget" name="my other name" name1="i"></div>
    </div>
</div>

nice, i liked the concept, hopefully will use it soon.