Call Typescript function in Javascript function

Question

I am getting the error Uncaught TypeError: Object #<Object> has no method 'getInvoices' when I call this.getInvoicesin the ajax.error result. How can I access the typescript function from there?

// Typescript
class InvoicesController {
     ...

     public getInvoices(skip: number, take: number): void {
         ...    
     }

     public createInvoice() {
          $.ajax({
            ...
            contentType: 'application/json',
            type: 'POST',
            success: function (res) {
                if (res.result === 'ok') {
                    this.getInvoices(0,100); // THIS DOES NOT WORK? 
                }
            },
            error: function (err) {
                this.getInvoices(0,100); // THIS DOES NOT WORK?
            }
        });
     }
}

possible duplicate of [$(this) inside of AJAX success not working](http://stackoverflow.com/questions/6394812/this-inside-of-ajax-success-not-working) — Matt Ball, Sep 25 '13 at 15:39
No, it doesn't. TypeScript compiles to JavaScript. Pass the `context` argument to `$.ajax()`. — Matt Ball, Sep 25 '13 at 15:41

score 5 · Accepted Answer · answered Sep 25 '13 at 15:41

check your scope. I believe when you are calling this you're actually referring to the ajax object and not the class InvoicesController

public createInvoice() {
      me = this;
      $.ajax({
         ....
        contentType: 'application/json',
        type: 'POST',
        success: function (res) {
            if (res.result === 'ok') {
                console.log('Data saved1');

            }
            else {
                console.log('Save error1');
            }
        },
        error: function (err) {
            me.getInvoices(100,0); // TRY THIS

            console.log("error2"+err);
        }
    });
 }

score 1 · Answer 2 · answered Sep 27 '13 at 12:55

Use short typescript functions syntax, it captures class context by default:

// Typescript
class InvoicesController {
 ...

 public getInvoices(skip: number, take: number): void {
     ...    
 }

 public createInvoice() {
      $.ajax({
        ...
        contentType: 'application/json',
        type: 'POST',
        success: (res) => {
            if (res.result === 'ok') {
                this.getInvoices(0,100); // WORK NOW 
            }
        },
        error: (err) => {
            this.getInvoices(0,100); // WORK NOW
        }
    });
 }

}

Call Typescript function in Javascript function

2 Answers2