title: Angular directive, refer to element content inside template
body: <p>I'm trying to make a directive that conditionally adds a line break if an angular expression is non-blank.  So far, I have this:</p>
  
  <pre><code>// this will show text with a &lt;br&gt; conditionally if the text is non-blank
  angular.module('myApp.directives').directive('brIf', function () {
      return {
          scope: {
              text: '='
          },
          template: '&lt;span ng-show="text &amp;&amp; text.trim().length"&gt;{{ text }}&lt;br/&gt;&lt;/span&gt;'
      };
  });
  </code></pre>
  
  <p>Which works if I use it like this (any part of the address might be undefined or blank):</p>
  
  <pre><code>&lt;br-if text="address.number + ' ' + address.street + ' ' + address.apt"&gt;&lt;/br-if&gt;
  </code></pre>
  
  <p>But what I really want is a directive I can use like this:</p>
  
  <pre><code>&lt;!-- put a br at the end of all this jazz, only if the expression is not blank --&gt;
  &lt;br-if&gt;{{address.number}} {{address.street}} {{address.apt}}&lt;/br-if&gt;
  </code></pre>
  
  <p>...to avoid all of the string math and the text= attribute.  I know I can write a link function in my directive that gets at the html content via the element parameter (I think?), but I don't know how to use the contents of that element in the template.  In other words, see my question inside the link function ...</p>
  
  <pre><code>// this will show text with a &lt;br&gt; conditionally if the text is non-blank
  angular.module('myApp.directives').directive('brIf', function () {
      return {
          scope: {
              text: '='
          },
          link: function(scope, elm, attrs, ctrl) {
              // I want the text of elm here to be used instead of 'text' 
              // in my template below.  Is this possible?
          },
          template: '&lt;span ng-show="text &amp;&amp; text.trim().length"&gt;{{ text }}&lt;br/&gt;&lt;/span&gt;'
      };
  });
  </code></pre>