angular.directive.ng:href.html

<h1>angular.directive.ng:href</h1>
<fieldset class="workInProgress">
  <legend>Work In Progress</legend>
  This page is currently being revised. It might be incomplete or contain inaccuracies.
  
</fieldset>
<h2>Description</h2>
<p>Using <tt>&lt;angular/&gt;</tt> markup like {{hash}} in an href attribute makes 
the page open to a wrong URL, ff the user clicks that link before 
angular has a chance to replace the {{hash}} with actual URL, the 
link will be broken and will most likely return a 404 error. 
The <code>ng:href</code> solves this problem by placing the <code>href</code> in the 
<code>ng:</code> namespace.</p>

<p>The buggy way to write it:</p><div ng:non-bindable><pre class="brush: js; html-script: true;">
<a href="http://www.gravatar.com/avatar/{{hash}}"/>
</pre></div><p>The correct way to write it:</p><div ng:non-bindable><pre class="brush: js; html-script: true;">
<a ng:href="http://www.gravatar.com/avatar/{{hash}}"/>
</pre></div>
<h2>Usage</h2>
<h3>In HTML Template Binding</h3>
<tt>
  <pre>
&lt;ANY ng:href="template"&gt;
  ...
&lt;/ANY&gt;
  </pre>
</tt>
<h3>Parameters</h3>
<ul>
    <li><tt>template</tt> –
      <tt>&#123;template&#125;</tt>
      <tt></tt>
      – any string which can contain <code>{{}}</code> markup.</li>
  </ul>