Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Nothing would change in terms of the way knockout bindings are declared in the markup however we would get the intellisense goodness once the interfaces are written for the knockout library. In this respect it would work just like the <a href="http://www.typescriptlang.org/Samples/#JQuery">jquery Sample</a>, which has a <a href="http://typescript.codeplex.com/SourceControl/changeset/view/d397c54a55db#samples/jquery/jquery.d.ts">typescript file containing interfaces for most of the jQuery api</a>.</p> <p>I think if you get rid of the two variable declarations for ko and $ your code will work. These are hiding the actual ko and $ variables that were created when the knockout and jquery scripts loaded.</p> <p>I had to do this to port the visual studio template project to knockout:</p> <p><strong>app.ts:</strong></p> <pre><code>class GreeterViewModel { timerToken: number; utcTime: any; constructor (ko: any) { this.utcTime = ko.observable(new Date().toUTCString()); this.start(); } start() { this.timerToken = setInterval(() =&gt; this.utcTime(new Date().toUTCString()), 500); } } window.onload = () =&gt; { // get a ref to the ko global var w: any; w = window; var myKO: any; myKO = w.ko; var el = document.getElementById('content'); myKO.applyBindings(new GreeterViewModel(myKO), el); }; </code></pre> <p><strong>default.htm:</strong></p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html lang="en" xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;TypeScript HTML App&lt;/title&gt; &lt;link rel="stylesheet" href="app.css" type="text/css" /&gt; &lt;script src="Scripts/knockout-2.1.0.debug.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="app.js"&gt;&lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;h1&gt;TypeScript HTML App&lt;/h1&gt; &lt;div id="content" data-bind="text: utcTime" /&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload