Does anyone know a easy date picker to use in an angular 2 app?
<p><strong>Does anyone know a easy date picker to use in an angular 2 app?</strong></p>

<p>I cant seem to get jquery ui date picker working?</p>

<p>does anyone know an easy one to implement.</p>

<p>I've tried html date but it doesnt work in all browsers.</p>

<p>I'm using typescript with html5 and angular2</p>

<p>I tried installing this one: <a href="http://jankuri.com/components/angular2-datepicker" rel="noreferrer">http://jankuri.com/components/angular2-datepicker</a></p>

<p>Bug I get this bug:</p>

<p><a href="https://i.stack.imgur.com/Bbnt5.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Bbnt5.png" alt="enter image description here"></a></p>

<p><strong>My current index.html file:</strong></p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
  &lt;head&gt;
    &lt;title&gt;test&lt;/title&gt;
    &lt;base href="/"&gt;&lt;/base&gt;

    &lt;meta charset="UTF-8"&gt;      
    &lt;meta content="IE=edge, chrome=1" http-equiv="X-UA-Compatible"/&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"&gt;

    &lt;link rel="icon" type="image/png" href="/favicon32.png" sizes="32x32"&gt;
    &lt;link rel="icon" type="image/png" href="/favicon96.png" sizes="96x96"&gt;
    &lt;link rel="icon" type="image/png" href="/favicon16.png" sizes="16x16"&gt;

    &lt;link rel="stylesheet" type="text/css" href="/css/animate.css" /&gt; 
    &lt;link rel="stylesheet" type="text/css" href="/bootstraptheme.css" /&gt;
    &lt;link rel="stylesheet" type="text/css" href="/css/styles.css" /&gt; 
    &lt;link href='https://fonts.googleapis.com/css?family=Lato:400,100,100italic,300italic,300,400italic,700italic,900,700,900italic' rel='stylesheet' type='text/css'&gt;
    &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"&gt;

    &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"&gt;&lt;/script&gt;


    &lt;script src="node_modules/moment/moment.js"&gt;&lt;/script&gt;


    &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"&gt;&lt;/script&gt;

    &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.18.4/system.src.js"&gt;&lt;/script&gt;   

    &lt;script&gt;
        System.config({
            transpiler: 'typescript',
            defaultJSExtensions: true,  
            typescriptOptions: {
                emitDecoratorMetadata: true,
            },          
            packages: {
                'angular2-google-maps': {
                  defaultExtension: 'js'
                }
            },
            map: {
                'ng2-datepicker': 'node_modules/ng2-datepicker'/*,
                'moment': 'node_modules/moment/moment.js'*/
            }
        });

    &lt;/script&gt;


    &lt;script src="/angular2_google_maps.js"&gt;&lt;/script&gt;

    &lt;script src="https://code.angularjs.org/2.0.0-beta.0/angular2-polyfills.js"&gt;&lt;/script&gt;
    &lt;script src="https://code.angularjs.org/tools/typescript.js"&gt;&lt;/script&gt;
    &lt;script src="https://code.angularjs.org/2.0.0-beta.0/Rx.js"&gt;&lt;/script&gt;

    &lt;script src="https://code.angularjs.org/2.0.0-beta.0/angular2.js"&gt;&lt;/script&gt;
    &lt;script src="https://code.angularjs.org/2.0.0-beta.0/router.js"&gt;&lt;/script&gt;
    &lt;script src="https://code.angularjs.org/2.0.0-beta.0/http.js"&gt;&lt;/script&gt;  

    &lt;script src="/firebase/firebaseNew.js"&gt;&lt;/script&gt;

    &lt;!--&lt;script src="https://cdn.firebase.com/js/client/2.3.2/firebase.js"&gt;&lt;/script&gt;--&gt;

  &lt;/head&gt;

  &lt;body id="container"&gt;

    &lt;app&gt;&lt;/app&gt;

    &lt;script&gt;      
      System.import('/app/app.component');
    &lt;/script&gt;

    &lt;script&gt;
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
      ga('create', 'UA-22148347-4', 'auto');
      ga('send', 'pageview');
    &lt;/script&gt;

  &lt;/body&gt;
&lt;/html&gt;
</code></pre>