AngularJS function in dialog called several times

Please see this code.

html code

<script type="application" id = "abc">
  <md-dialog>
    {{loadServerFile();}}
  </md-dialog>
</script>

javascript code

    loadServerFile : function(){
      $.ajax({
       url: "/homepage/create"
       success: function(){
          console.log("success");
          $scope.closeDialog();
        }
      });
    }

Here closeDialog close the id = ‘abc’ dialog.

But console.log(“success”) calling is doing more than 10 times.

Why this kind of problem happen?
How can I make this function call once?

javascript code

angular.module("imageedit").service('canvas',['$rootScope','$mdDialog'],function($rootScope, $mdDialog){
...
start: function(url){
$mdDialog.show({
   template: $('abc').html()
   controller: 'GGG'
   clickOutsidetoClose: false,
   })
   ...
 }
   ...
})

Here I called $mdDialog.show to call dialog.
But in fact I only want to call loadServerfile in GGG controller.
Have you got any answer?
What I expect: $rootScope.call(loadServerFile);

Based on the new information, that you do not want the dialog, in your GGG controller, add this code, which will run one time. It will place the result of the call in $scope.homepageCreateResult. If you don’t need to make this call at all, and do not need the dialog, delete all of the code you reference.

   $scope.homepageCreateResult = {};
   $http.get("/homepage/create")
        .then(function(resp) {
            console.log('success', resp);
            $scope.homepageCreateResult = resp.data;
        });

In your HTML, just remove all of this:

<script type="application" id = "abc">
  <md-dialog>
    {{loadServerFile();}}
  </md-dialog>
</script>