Wijmo 5 - AngularJS directives

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.grapecity.com/wijmo/5.latest/styles/wijmo.min.css">
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.input.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/interop/angular/wijmo.angular.min.js"></script>
<!-- mark this as an Angular application and give it a controller -->
<div ng-app="app" ng-controller="appCtrl" class="container">
    <wj-input-date value-changed="changed(s, e)" value=data.dateGMT></wj-input-date>
</div>

CSS

.wj-flexgrid {
     height: 450px;
     width: auto;
     margin-bottom: 20px;
 }

 body {
     margin: 40px;
 }

TypeScript

// define app, include Wijmo 5 directives
var app = angular.module('app', ['wj']);

// controller
app.controller('appCtrl', function($scope) {
	
	$scope.changed = function(s, e) {
		$scope.data.date = s.value.toUTCString();
		console.dir($scope.data.dateGMT); // will store the original date independent of time zone
		console.dir($scope.data.date); // will store the updated date dependent on time zone
	}
	
    $scope.data = {
		dateGMT: "2019-07-10T00:00:00Z"
	}
});