title: Angular : src attribute bug in Iframe directive
body: <p>I'm having a problem with a Iframe directive that I try to implement.</p>
  
  <p>As far I am : 
  Template: </p>
  
  <pre><code>&lt;div class="externalIframe" iframe-src="external.html"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Directive : </p>
  
  <pre><code>angular.module('project.directives', [])
     .directive('externalIframe', ['$rootScope', function($rootScope) {
        return {
          restrict: 'C',
          replace: true,
          transclude: true,
          scope: {
            src: '@iframeSrc', // the src uses the data-binding from the parent scope
          },
          template: '&lt;iframe src="{{src}}" height="100%" width="100%" frameborder="0"&gt;&lt;/iframe&gt;',
          link: function(scope, elem, attrs) {
            //elem.src = "dummy.html"; // not working either
          }
        }
      }])
  </code></pre>
  
  <p>Problem : It fires 2 HTTP request (2 iframe loading). :</p>
  
  <ul>
  <li>one to <code>http://localhost:8000/app/{{src}}</code> (iframe src not yet interpreated by angular)</li>
  <li>one to <code>http://localhost:8000/app/external.html</code> (iframe src once interpreated by angular)</li>
  </ul>
  
  <p>I want to avoid the useless first call.. How can I do that ?</p>
  
  <p>I tried without src in the template and programmatically set it in the link or compile function but that doesn't fire the iframe loading.</p>
  
  <p><strong>edit: <a href="http://jsfiddle.net/A8Vgk/7/" rel="noreferrer">jsFiddle</a> added for bug demo with compile method</strong>
  => you'll see in the network tab of firebug/chrome dev panel that two request are made :</p>
  
  <ul>
  <li><code>http://fiddle.jshell.net/_display/%7B%7Bsrc%7D%7D</code></li>
  <li><code>http://fiddle.jshell.net/_display/external.html</code></li>
  </ul>
  
  <p>Thanks for the help</p>