title: How do I call a function using $scope from HTML added by a directive in angularjs
body: <p>I moved the following HTML from a controller to a directive, as part of HTML I wanted subbed in when a button was clicked.  The problem is that now the save button(below) does nothing.  I tried changing the ng-click to a different function I included in the directive code, and that worked, but I know that a function that is saving data belongs in the controller.  How can I access the saveStudent function?  (When the HTML was right in the view, I used to use $scope.saveStudent in the controller.)</p>
  
  <p>I'm sorry if this question has been asked before.  I tried my best to look through the related questions, but I'm new to angular so it's likely I missed a similar one.  Thanks!</p>
  
  <pre><code>&lt;button class="btn-bl btn-bl-red pull-right" ng-click="saveStudent(addStudentForm);" ng-enable="addStudentForm.$valid"&gt;
      SAVE
  &lt;/button&gt;
  </code></pre>
  
  <p>This is the function (within the link function in the directive) that loads the new template when a button is clicked.</p>
  
  <pre><code>        function studentEditForm(element) {
              var templateUrl = baseUrl + 'settings-edit.html';
              templateLoader = $http.get(templateUrl, {
                  cache : $templateCache
              }).success(function(html) {
                  element.html(html);
              }).then(function() {
                  var compiled = $compile(element.html())(scope);
                  element.html(compiled);
              });
  
          };
  
          templateLoader.then(function() {
              var compiled = $compile(element.html())(scope);
              element.html(compiled);
          });
  </code></pre>
  
  <p>I'm wondering if maybe the fact that the HTML is being compiled by the directive is the problem?</p>