AngularJS 1.2.x+ google maps marker and infobox

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.date = new Date();
});
 
 
function initialize() {
  var mapOptions = {
    zoom: 9,
    center: new google.maps.LatLng(42.397, -83.644)
  };
    var contentString = '<div id="content">'+
      '<div id="siteNotice">'+
      '</div>'+
      '<h1 id="firstHeading" class="firstHeading">Detroit</h1>'+
      '<div id="bodyContent">'+
      '<p><b>This is a test location ' +
       
      '</div>'+
      '</div>';
      
      
 
  var marker;
var parliament = new google.maps.LatLng(42.327383, -83.06747);
  var map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);
      
       marker = new google.maps.Marker({
    map:map,
    draggable:true,
    animation: google.maps.Animation.DROP,
    position: parliament
  });
   var infowindow = new google.maps.InfoWindow({ 
      content: contentString
  }); 
  

 google.maps.event.addListener(marker, 'click', function(){
   infowindow.open(map,marker);
 });
}
function toggleBounce() {

  if (marker.getAnimation() !== null) {
    marker.setAnimation(null);
  } else {
    marker.setAnimation(google.maps.Animation.BOUNCE);
  }
}
function loadScript() {
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&' +
      'callback=initialize';
  document.body.appendChild(script);
}

window.onload = loadScript;

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>Geolocation</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.2.x" src="https://code.angularjs.org/1.2.25/angular.js" data-semver="1.2.25"></script>
    <script src="app.js"></script>
   
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
     <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>

  </head>

  <body ng-controller="MainCtrl">
  {{date}}
    <div id="map-canvas"></div>
  </body>

</html>

/* Put your css in here */

    html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }

This is a test for asychronous loading of google maps
to make sure the page laods when maps and other map related items are ready
to load