title: angular-material - $mdSticky duplicates object
body: <p>I'm starting to work with Angular Material and I want to make a sticky toolbar, so I went to the documentation and read about $mdSticky. So I wrote my directive, but the toolbar repeats itself when cloning. Can this be fixed/removed?</p>
  
  <p>index.html</p>
  
  <pre><code>&lt;body ng-cloak&gt;
  
  
    &lt;md-content layout-fill&gt;
      &lt;div layout="column"&gt;
        &lt;md-toolbar class="md-medium-tall md-accent" layout-align="center" md-toolbar-shrink nio-sticky&gt;
          &lt;div class="md-toolbar-tools" layout="row"&gt;
            &lt;span flex&gt;
          &lt;button class="md-button md-icon-button" hide-gt-sm md-ink-ripple&gt;
            &lt;md-icon md-svg-icon="assets/icons/menu-button.svg"&gt;
            &lt;/md-icon&gt;
          &lt;/button&gt;
        &lt;/span&gt;
            &lt;div flex layout="row" layout-align="end" layout-align-gt-sm="center"&gt;
              &lt;img src="assets/img/naumovski-logo.svg" layout-align="center" /&gt;
            &lt;/div&gt;
            &lt;span flex show-gt-sm hide-xs hide-sm&gt;
        &lt;/span&gt;
          &lt;/div&gt;
        &lt;/md-toolbar&gt;
        &lt;md-nav-bar hide-xs hide-sm md-selected-nav-item="'home'" nav-bar-aria-label="navigation links"&gt;
          &lt;div flex layout="row" layout-align="center"&gt;
            &lt;md-nav-item md-nav-click="goto('home')" name="home"&gt;Page One&lt;/md-nav-item&gt;
            &lt;md-nav-item md-nav-click="goto('page2')" name="page2"&gt;Page Two&lt;/md-nav-item&gt;
            &lt;md-nav-item md-nav-click="goto('page3')" name="page3"&gt;Page Three&lt;/md-nav-item&gt;
            &lt;md-nav-item md-nav-click="goto('page4')" name="page4"&gt;Page Four&lt;/md-nav-item&gt;
          &lt;/div&gt;
        &lt;/md-nav-bar&gt;
      &lt;/div&gt;
      &lt;md-content&gt;
        //content here
        &lt;br /&gt;
      &lt;/md-content&gt;
    &lt;/md-content&gt;
  </code></pre>
  
  <p>sticky.js</p>
  
  <pre><code>(function () {
      'use strict';
  
      angular
          .module('naumovskiIo')
          .directive('nioSticky', sticky);
  
      sticky.$inject = ['$mdSticky', '$compile'];
  
      function sticky($mdSticky, $compile) {
          return {
              restrict: 'A',
              replace: true,
              link: function(scope, element) {
                  $mdSticky(scope, element);
              }
          }
      }
  })();
  </code></pre>
  
  <p>I also tried creating a separate template just for the toolbar, i.e not a general directive and then compiling it, however it was still a failure. Any help?</p>