Famous / famous-angular

Bring structure to your Famo.us apps with the power of AngularJS. Famo.us/Angular integrates seamlessly with existing Angular and Famo.us apps.

Home Page:https://famo.us/angular

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

fa-surface is not scoping correctly its transcluded content

thaiat opened this issue · comments

Hi,

It seems to me there is an issue with how fa-surface and potentially other directives are scoping their transcluded content using the manual transclude function.

First here is a small repro explaining the issue: http://codepen.io/thaiat/pen/KwvVEK

simpleHtml is a transcluded directive with isolated scope.
When it's inner content reference the scope of the parent controller, everything works fine, as well as for the isolated scope attribute.

app.directive('simpleHtml', function() {
  return {
    scope : {
      title: '='
    },
    transclude: true,
    template: '<div class="box"><div class="title">Title: {{title}}</div><ng-transclude></ng-transclude></div>'
  }
});

Now if i write a second directive simpleFamous, replacing the outer div of simpleHtml by an fa-surface, this stops working, as the transcluded content does not see any more the parent controller scope.

app.directive('simpleFamous', function() {
   return {
    scope : {
      title: '='
    },
    transclude: true,
    template: '<fa-surface fa-size="[250,80]" class="box"><div class="title">Title: {{title}}</div><ng-transclude></ng-transclude></fa-surface>'
  }
});

One quick fix is to force my directive to use scope:true. But then it forces me to manually take care of the bindings.

Any idea what's going on ?