Multiple directives asking for new/isolate scope.

[viztastic]

Hi @hellsan631 ,

I love this plugin. When I use it in conjunction with Angular Material (https://github.com/angular/material/) I get this error:

Error: [$compile:multidir] Multiple directives [mdFabToolbar (module: material.components.fabToolbar), pagePiling (module: pagePiling.js)] asking for new/isolated scope on: <md-fab-toolbar md-direction="right" style="position:fixed; width:100%; top:0;" page-piling="">

Is there a way around using isolated scopes with this directive?

[hellsan631]

There is a conflict as mdFabToolbar is a directive itself with its own scope, and attaching a second directive with a its own scope would cause that conflict. I would recommend using a normal div element as a holder and attaching it one down the line. So:

<md-fab-toolbar md-direction="right">
  <div page-piling style="position:fixed; width:100%; top:0;">
    <div class="section">Section 1</div>
    <div class="section">Section 2</div>
  </div>
</md-fab-toolbar>

This would mean however, that the pagePiling would happen inside of your toolbar, and not on the main body of the page. Is this what you want?

<md-fab-toolbar md-direction="right">
  <!-- Toolbar elements -->
</md-fab-toolbar>

<div page-piling>
  <div class="section">Section 1</div>
  <div class="section">Section 2</div>
</div>

Doing something like this would make it so the toolbar is its own thing and the pagePiling would happen normally (not inside your toolbar)

[viztastic]

Thanks @hellsan631 much appreciated!