javascript - AngularJS : Bind to transclusive directive without isolating the scope -

let's have angular markup like:

<custom bindto="modelproperty">     <!-- trascluded content. --> </custom> 

would possible custom directive bind using bindto attribute, allowing properties accessible transcluded content, without isolating scope of custom? basically, want directive bind custom part of model without cutting off scopes of parents , without having add code like:

scope.prop = scope.$parent.prop; 

any ideas?

edit imagine structured http://plnkr.co/edit/zq2oo1?p=preview, except working , without isolate scope.

by using scope: true can maintain access parent scope's properties via prototypical inheritance while maintaining unique scopes each instance of directive (ie. reusable). (note: make sure observe the dot rule models need change on parent scope within transcluded content)

you'll need call transclude function compile function, passing directive's scope first argument in order link transcluded content against it.

it might this:

.directive('custom', function() {   return {     restrict: 'e',     transclude: true,     scope: true,     link: function(scope, elem, attrs, ctrl, transclude){        scope.bindto = scope[attrs.bindto];       transclude(scope, function(clone){         elem.find('ng-transclude').replacewith(clone);       });     },     template: '<div>from parent scope: <i>{{somevar}}</i> <ng-transclude></ng-transclude></div>'   } }); 

demo