title: Compile Element in Parent Scope
body: <p>I got two directives. The first <code>mark-required</code> goes through all elements in checks if they are required, if so it adds a* and some css etc.</p>
  
  <p>The second <code>flexible-required</code> makes an input field dynamically required, I need it because diff. user inputs have diff. required fields.</p>
  
  <p>I get the second directive working with <code>compile</code> but the directives from the parent scope e.g. <code>mark-required</code> do get ignored.</p>
  
  <h2>Directive <code>flexible-required</code></h2>
  
  <pre><code>angular.module 'tsd.flexibleRequired', ['ui.bootstrap.showErrors']
    .directive 'flexibleRequired', ($http, $rootScope, implantsService) -&gt;
      return {
        restrict: 'A'
        scope:
          isRequired: '='
        controller: ($scope, $element, $compile) -&gt;
          compileElement = $element[0]
          # compileForm = angular.element(document).find('form')[0] #B
          $scope.$watch('isRequired', (newValue, oldValue)-&gt;
            if newValue != oldValue
              if newValue == true
                compileElement.required = true
              else
                compileElement.required = false
  
              $compile(compileElement)($scope) #A
              # $compile(compileForm)($scope.$parent) #B
          )
          return
      }
  </code></pre>
  
  <ul>
  <li>A: If I add <code>$scope.$parent</code>in that spot nothing happens</li>
  <li>B: If I do uncomment the lines below, it does work, but all my inputs get compiled, I only want to have this specific element compiled in my parent scope. </li>
  </ul>
  
  <h2>HTML</h2>
  
  <pre><code>&lt;form name="patientDataForm" ng-submit="save()" mark-required&gt;
  ...
            &lt;div class="form-group col-lg-6" show-errors&gt;
              &lt;label&gt;Versicherungsnummer/Krankenkasse&lt;/label&gt;
              &lt;input type="text" class="form-control" name="insurance" ng-model="registerPatientController.patientData.insurance" placeholder="Versicherungsnummer oder Krankenkasse" ng-pattern="/^[0-9].*$/" is-required="registerPatientController.patientData.sendToEprd"flexible-required enter-to-tab/&gt;
              &lt;p class="help-block" ng-if="patientDataForm.insurance.$error"&gt;Ihre Versicherungsnummer/Krankenkasse wird benötigt!&lt;/p&gt;
            &lt;/div&gt;
  </code></pre>
  
  <h2>Question:</h2>
  
  <p>How can I only compile <code>compileElement</code> in the parent scope?</p>