TypeScript: Property does not exist on type '{}'

Question

I am using Visual Studio 2013 fully patched. I am trying to use JQuery, JQueryUI and JSRender. I am also trying to use TypeScript. In the ts file I'm getting an error as follows:

Property 'fadeDiv' does not exist on type '{}'.

I think I have the correct references for JQuery, JQueryUI and JSRender for TypeScript, but from what I've read this is looking like a d.ts issue.

There are no errors in JavaScript, but I don't want to have Visual Studio saying there are errors if I can help it. Both times fadeDiv is mentioned in the JavaScript there is a red line under it and both errors say the same thing as above.

/// <reference path="../scripts/typings/jquery/jquery.d.ts" /> /// <reference path="../scripts/typings/jqueryui/jqueryui.d.ts" /> /// <reference path="typings/jsrender/jsrender.d.ts" />  var SUCSS = {};  $(document).ready(function () {    SUCSS.fadeDiv(); });  SUCSS.fadeDiv = function () { var mFadeText: number; $(function () {     var mFade = "FadeText";     //This part actually retrieves the info for the fadediv     $.ajax({         type: "POST",         //url: "/js/General.aspx/_FadeDiv1",         url: "/js/sucss/General.aspx/_FadeDivList",         //data: "{'iInput':" + JSON.stringify(jInput) + "}",         contentType: "application/json; charset=utf-8",         dataType: "json",         error: function (xhr, status, error) {             // Show the error             //alert(xhr.responseText);         },         success: function (msg) {             mFadeText = msg.d.Fade;             // Replace the div's content with the page method's return.             if (msg.d.FadeType == 0) {//FadeDivType = List                 var template = $.templates("#theTmpl");                 var htmlOutput = template.render(msg.d);                 $("[id$=lblFadeDiv]").html(htmlOutput);             }             else {//FadeDivType = String                 $("[id$=lblFadeDiv]").html(msg.d.FadeDivString);             }         },         complete: function () {             if (mFadeText == 0) {                 $("[id$=lblFadeDiv]").fadeIn('slow').delay(5000).fadeOut('slow');             }         }     }); }); 

For those who might read this later, the SUCSS is the namespace. In typescript it appears I would have wanted to do something like this.

$(document).ready(function () {     SUCSS.fadeDiv(); }); module SUCSS {     export function fadeDiv () {}; }; 

So the function is made public by use of the export and I could call the SUCSS.fadeDiv to run on page load by calling it with the SUCSS.fadeDiv();. I hope that will be helpful.

Answer 1

You can assign the any type to the object:

let bar: any = {}; bar.foo = "foobar";  

Answer 2

Access the field with array notation to avoid strict type checking on single field:

data['propertyName']; //will work even if data has not declared propertyName 

---

Alternative way is (un)cast the variable for single access:

(<any>data).propertyName;//access propertyName like if data has no type 

The first is shorter, the second is more explicit about type (un)casting

---

You can also totally disable type checking on all variable fields:

let untypedVariable:any= <any>{}; //disable type checking while declaring the variable untypedVariable.propertyName = anyValue; //any field in untypedVariable is assignable and readable without type checking 

Note: This would be more dangerous than avoid type checking just for a single field access, since all consecutive accesses on all fields are untyped