title: Cannot receive value of isolated scope in directive
body: <p>I created this directive</p>
  
  <pre><code>angular.module('panel')
              .directive('sigPanel', sigPanel)
  
      function sigPanel() {
          return {
              restrict: 'E',
              scope:{
                  imgData:"="
              },
              templateUrl: 'app/widgets/signature/signature.html',
              link: function (scope, element, attrs) {
                  console.log(scope.imgData);
              }
          }
      }
  </code></pre>
  
  <p>This is the templateURL:</p>
  
  <pre><code>&lt;canvas style="border:1px solid black;"&gt;&lt;/canvas&gt;
  </code></pre>
  
  <p>And added this into the HTML:</p>
  
  <pre><code>&lt;sig-panel imgData="test"&gt;&lt;/sig-panel&gt;
  </code></pre>
  
  <p>The console log only outputs "undefined", shouldn't it log "test"? I know the directive html tag is working properly because the canvas appears on the page, but why won't the directive pick up the value of "imgData"?</p>
  
  <p>If I try setting the scope.imgData inside the directive I get the error</p>
  
  <pre><code>[$compile:nonassign] Expression 'undefined' used with directive 'signaturePanel' is non-assignable!
  </code></pre>
  
  <p>Not sure why this is happening.</p>