title: Syntax Error: Token ':' is an unexpected token when passing variable to directive
body: <p>I have a directive called <code>iframely</code> and I it inside an <code>ng-repeat</code> like this:</p>
  
  <pre><code>&lt;iframely url="iterator.url"&gt;&lt;/iframely&gt;
  </code></pre>
  
  <p>This just treats the value as the string <code>"iterator.url"</code>, not the actual <code>.url</code> value. To experiment, I just put in a URL directly:</p>
  
  <pre><code>&lt;iframely url="https://soundcloud.com/braxe1/braxe-one-more-chance"&gt;&lt;/iframely&gt;
  </code></pre>
  
  <p>Which gives me the <code>Syntax Error: Token ':' is an unexpected token</code> error. The closest I've gotten to passing this value to the directive is:</p>
  
  <pre><code>&lt;iframely url="'{{iterator.url}}'"&gt;&lt;/iframely&gt; // note double and single quotes
  </code></pre>
  
  <p>This resolves the URL parameter of <code>iterator</code>, but also passes it along with the <code>' '</code> single-quotes as part of the string.</p>
  
  <hr>
  
  <p>EDIT: Also tried that without the single quotes.</p>
  
  <pre><code>&lt;iframely url="{{iterator.url}}"&gt;&lt;/iframely&gt;
  </code></pre>
  
  <p>And got <code>Error: [$parse:syntax] Syntax Error: Token '{' invalid key at column 2 of the expression [{{iterator.url}}] starting at [{iterator.url}}]</code></p>
  
  <p>What is the correct way to do this?</p>
  
  <hr>
  
  <p>EDIT2: Here is the code for the directive:</p>
  
  <pre><code>angular.module( 'iframely', [])
  
  .directive( 'iframely', [ '$http', '$sce', function ( $http, $sce ) {
      return {
          replace: true,
          restrict: "E",
          scope: {
              url: '='
          },
          template: '&lt;div ng-bind-html="content"&gt;&lt;/div&gt;',
          link: function ( scope, element, attrs ) {
              $http( {
                  url: 'http://localhost:8061/iframely',
                  method: 'GET',
                  params: {
                      url: attrs.url
                  }
              })
              .then( function ( result ) {
                  scope.content = $sce.trustAsHtml( result.data.html )
              })
          }
      }
  }])
  </code></pre>