title: I can pass a scope variable into a directive's link function, but not the compile function, angular
body: <p>I'm using ng-repeat and I need to pass a scope variable into a directive's compile function. I know how to do it with the link function, but not the compile function.</p>
  
  <p>My html looks like:</p>
  
  <pre><code>    &lt;div ng-repeat="item in chapter.main"&gt;
        &lt;block type="item.type"&gt;&lt;/block&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>Let's say item.type="blah" no matter the item. 
  Then this link function works fine</p>
  
  <pre><code>app.directive('block', function() {
    return {
        restrict: 'E',
        link: function(scope, element, attributes){
              scope.$watch(attributes.type, function(value){
                  console.log(value); //will output "blah" which is correct
              });
  
          }
    }
  });
  </code></pre>
  
  <p>But I can't do the same with compile?</p>
  
  <pre><code>app.directive('block', function() {
    return {
        restrict: 'E',
        compile: function(element, attrs, scope) {
          scope.$watch(attrs.type, function(value){
               console.log(value);
           });
        }
    }
  });
  </code></pre>
  
  <p>The error I get is "cannot read property $watch of undefined".. </p>
  
  <p>This is how I'd like my directive to look like:</p>
  
  <pre><code>app.directive('block', function() {
    return {
        restrict: 'E',
        compile: function(element, attrs) {
          element.append('&lt;div ng-include="\'{{type}}-template.html\'"&gt;&lt;/div&gt;');
          //or element.append('&lt;div ng-include="\'{' + attrs.type + '}-template.html\'"&gt;&lt;/div&gt;');
          //except the above won't interpret attr.type as a variable, just as the literal string 'item.type'
        }
    }
  });
  </code></pre>