'Why my angularjs controller gets called twice?

I have been looking to find solution to below. However, it keeps evading me somehow. I am new to AngularJS. Need some help. I have an index.htm file loading initially with following code. As part of this file header.htm is loaded. I am calling the AngularJS function getProperties() in header.htm file. However, when I try to alert i get 2 alerts. Meaning function is getting called twice. I have only called it once.

<?php
session_start();
    
    //Load Header & Footer Template After Completion of Page Body Objects
    require_once($wsdocroot."/content/themes/default/views/header.htm");
    require_once($wsdocroot."/content/themes/default/views/footer.htm");    
} 

?>

    <script>    
    angular.module('myApp', []).controller("myCtrl", function($scope,$http){
        $scope.getProperties = function(whichArray='',retOption='',retOptionValue='',dynamicObjectID=''){
        alert('here');
        var returnString = ''; 
return returnString;
    };
</script>

My html file is as below:

    <html lang="en" ng-app="myApp" ng-controller="myCtrl" ng-init="wslink='<?php echo $wslink; ?>'; wspage='<?php echo $pageID; ?>';">
<head>
    <title>{{getProperties(wspage,'property','title')}}</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--
    <meta name="description" content="{{getProperties('<?php echo $pageID; ?>','property','description')}}">
    <meta name="keywords" content="{{getProperties('<?php echo $pageID; ?>','property','keywords')}}">
    -->
    <meta name="robots" content="index, archive">  
    <script src="/mserp/admin/includes/angularjs/angular.min.js"></script>
    <script src="/mserp/admin/includes/angularjs/angular.animate.js"></script>
    <script src="/mserp/admin/includes/angularjs/angular.route.js"></script>
    <script src="/mserp/admin/includes/angularjs/angular.sanitize.js"></script>
    <link rel="stylesheet" type="text/css" href="/mserp/admin/includes/css/style.css">
    <link rel="stylesheet" href="/mserp/admin/includes/css/w3.css">        
</head>
<body></body></html>

After which I have the script for AngularJS in the same html file.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source