title: Can an external SVG document contain an AngularJS ng-click or ng-model directive?
body: <p>I'm creating a touchscreen directory and I'm using AngularJS framework.  </p>
  
  <p>I want some information to appear in the html document when a shape in the SVG document is clicked on. </p>
  
  <p>I'm using the <code>object</code> tag to embed the svg document into the html document.</p>
  
  <p>If I add a <code>ng-if</code> or <code>ng-model</code> directive in the external SVG document, will that work?<br>
  If it does, do I need to put a <code>ng-controller</code> directive in the SVG document ? </p>
  
  <p><strong>Example:</strong></p>
  
  <p>HTML</p>
  
  <pre><code>&lt;object ng-attr-data="image.svg" type="image/svg+xml"&gt;&lt;/object&gt;    
  &lt;div ng-if="click"&gt;Hello&lt;/div&gt;
  </code></pre>
  
  <p>SVG</p>
  
  <pre><code>&lt;svg&gt;
    &lt;g id="Layer_2"&gt;
      &lt;rect x="95.8" y="61.3" id="101" class="st2" width="349.5" height="227.1" ng-model="click"/&gt;
    &lt;/g&gt;
  &lt;/svg&gt;
  </code></pre>