title: Angular directive attributes cause an error
body: <p>I am trying write an angular directive to make a substring of an attribute that is passed in. Below is my code: </p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;body ng-controller="MainCtrl"&gt;
       &lt;div&gt;&lt;substring message="This is a test."&gt;&lt;/substring&gt;&lt;/div&gt;
       &lt;div&gt;&lt;substring message="So is this." &gt;&lt;/substring&gt;&lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>Angular/Javascript:</p>
  
  <pre><code>var app = angular.module('myapp', []);
  
  app.controller('MainCtrl', function($scope) {
  
  });
  
  app.directive('substring', function () {
  return {
      restrict: 'AE',
      replace: true,
      scope: { text: '=message' }, 
      link: function (scope, elem, attrs) {
          //alert(attrs.message); 
          var str = attrs.message;
  
          scope.text = str.substring(1, 4);
      },
      template: '&lt;H1&gt;{{text}}&lt;/H1&gt;'
  };
  });
  </code></pre>
  
  <p>When I try running this I get the following error: </p>
  
  <blockquote>
    <p>HTML1300: Navigation occurred.
    File: directive.html
    Error: [$parse:syntax] Syntax Error: Token 'is' is an unexpected token at column 6 of the expression [This is a test.] starting at [is a test.].</p>
  </blockquote>
  
  <p>Also, I have tried changing </p>
  
  <pre><code>'=message' to '@message'
  </code></pre>
  
  <p>but that just causes the substring stuff I am doing in the link function to get ignored. </p>
  
  <p>Why the error? Is Angular not seeing that stuff in the quotation marks as a string and instead trying to parse out some command? Most importantly, how do I fix this? </p>
  
  <p>Thanks</p>