Wednesday, April 24, 2013

How To Convert Date To String in TypeScript


 In this article I am describing the date object's "toDateString" method in the 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). 


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
Date.toDateString()

Function

    convertdate()
    {
        var date = new Date();
        var span = document.createElement("span");
        span.innerText = "Current Time is -> " + date + "\n";
        document.body.appendChild(span);
       
        var span = document.createElement("span");
        span.style.color = "#00CC99";
        span.innerText = "After change Date -> " + date.toDateString() + "\n";
        document.body.appendChild(span);
    }

Complete Program
Convert_Date.ts
class ConvertDate
{
    convertdate()
    {
        var date = new Date();
        var span = document.createElement("span");
        span.innerText = "Current Time is -> " + date + "\n";
        document.body.appendChild(span);
       
        var span = document.createElement("span");
        span.style.color = "#00CC99";
        span.innerText = "After change Date -> " + date.toDateString() + "\n";
        document.body.appendChild(span);
    }
}
window.onload = () =>
{
    var obj = new ConvertDate();
    var bttn = <HTMLButtonElement>(document.getElementById("Button1"));
    bttn.onclick = function () {
        obj.convertdate();
    }
};

Convert_Date_to_String_Demo.htm
<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>TypeScript HTML App</title>
    <link rel="stylesheet" href="app.css" type="text/css" />
    <script src="Convert_Date.js"></script>
</head>
<body>
    <h3>toDateString() method in TypeScript</h3>
    <div id="content" style="font-weight: normal; font-size: small">Click the button to display a date as a string<br />
        <br />
        <input id="Button1" type="button" value="Change Date to String" /></div>
</body>
</html>
Convert_Date.js
var ConvertDate = (function () {
    function ConvertDate() { }
    ConvertDate.prototype.convertdate = function () {
        var date = new Date();
        var span = document.createElement("span");
        span.innerText = "Current Time is -> " + date + "\n";
        document.body.appendChild(span);
        var span = document.createElement("span");
        span.style.color = "#00CC99";
        span.innerText = "After change Date -> " + date.toDateString() + "\n";
        document.body.appendChild(span);
    };
    return ConvertDate;
})();
window.onload = function () {
    var obj = new ConvertDate();
    var bttn = (document.getElementById("Button1"));
    bttn.onclick = function () {
        obj.convertdate();
    };
};
//@ sourceMappingURL=Convert_Date.js.map