Post
Ask Question

Convert Date To String in TypeScript

Introduction

 
The Date object is the key to date and time functionality in TypeScript. If we create it with no argument passed to its constructor, it will contain the current date and time of the user's computer. The Date object also provides a number of functions dealing with something called Coordinated Universal Time (UTC) time, also known (in the Winter) as Greenwich Mean Time (GMT).
 
In this article, I am describing the date object's "toDateString" method in the TypeScript.
 

toDateString() Method

 
In TypeScript, the toDateString() method converts the date of a Date object into a readable string, but it does not convert the time.
 
Syntax
  1. Date.toDateString()  
Function
  1. convertdate() {  
  2.  var date = new Date();  
  3.  var span = document.createElement("span");  
  4.  span.innerText = "Current Time is -> " + date + "\n";  
  5.  document.body.appendChild(span);  
  6.  var span = document.createElement("span");  
  7.  span.style.color = "#00CC99";  
  8.  span.innerText = "After change Date -> " + date.toDateString() + "\n";  
  9.  document.body.appendChild(span);  
  10. }  

Complete Program

 
Convert_Date.ts
  1. class ConvertDate {  
  2.   convertdate() {  
  3.     var date = new Date();  
  4.     var span = document.createElement("span");  
  5.     span.innerText = "Current Time is -> " + date + "\n";  
  6.     document.body.appendChild(span);  
  7.     var span = document.createElement("span");  
  8.     span.style.color = "#00CC99";  
  9.     span.innerText = "After change Date -> " + date.toDateString() + "\n";  
  10.     document.body.appendChild(span);  
  11.   }  
  12. }  
  13. window.onload = () => {  
  14.   var obj = new ConvertDate();  
  15.   var bttn = < HTMLButtonElement > (document.getElementById("Button1"));  
  16.   bttn.onclick = function() {  
  17.     obj.convertdate();  
  18.   }  
  19. };   
Convert_Date_to_String_Demo.htm
  1. <!DOCTYPE html>  
  2. <html lang="en"  
  3.     xmlns="http://www.w3.org/1999/xhtml">  
  4.     <head>  
  5.         <meta charset="utf-8" />  
  6.         <title>TypeScript HTML App</title>  
  7.         <link rel="stylesheet" href="app.css" type="text/css" />  
  8.         <script src="Convert_Date.js"></script>  
  9.     </head>  
  10.     <body>  
  11.         <h3>toDateString() method in TypeScript</h3>  
  12.         <div id="content" style="font-weight: normal; font-size: small">Click the button to display a date as a string  
  13.             <br />  
  14.             <br />  
  15.             <input id="Button1" type="button" value="Change Date to String" />  
  16.         </div>  
  17.     </body>  
  18. </html>  
Convert_Date.js
  1. var ConvertDate = (function() {  
  2.   function ConvertDate() {}  
  3.   ConvertDate.prototype.convertdate = function() {  
  4.     var date = new Date();  
  5.     var span = document.createElement("span");  
  6.     span.innerText = "Current Time is -> " + date + "\n";  
  7.     document.body.appendChild(span);  
  8.     var span = document.createElement("span");  
  9.     span.style.color = "#00CC99";  
  10.     span.innerText = "After change Date -> " + date.toDateString() + "\n";  
  11.     document.body.appendChild(span);  
  12.   };  
  13.   return ConvertDate;  
  14. })();  
  15. window.onload = function() {  
  16.   var obj = new ConvertDate();  
  17.   var bttn = (document.getElementById("Button1"));  
  18.   bttn.onclick = function() {  
  19.     obj.convertdate();  
  20.   };  
  21. };  
  22. //@ sourceMappingURL=Convert_Date.js.map   
Output
For more information, download the attached sample application.


Similar Articles