Typescript cannot invoke expression whost type lacks a call signature

Question

I'm aware there are similar questions but I havent found anything that answers my question so far Im just trying to create a simple function in my angular application

app.component.ts

formClick() {

    const formContainer = <HTMLElement>document.querySelector('.form-container');
    const spinner = <HTMLElement>document.querySelector('.loading-spinner');
    const form = <HTMLElement>document.querySelector('.email-form');

    form.style.display = 'none';
    spinner.style.display = 'block';

    setTimeout(function(){
       spinner.style.display = 'none';
       formContainer.innerHTML('<h1>Thanks! We will get back to you shortly</h1>')
    }, 1000);
}

but im getting an error on my formContainer.innerHTML that says

[ts] Cannot invoke an expression whose type lacks a call signature. Type 'String' has no compatible call signatures. (property) Element.innerHtml: string

I'm not sure what this means, any help would be appreciated,

Thanks

Hung Tran Hung Tran · Accepted Answer · 2018-01-08T00:22:37

I think the problem is this line formContainer.innerHTML('<h1>Thanks! We will get back to you shortly</h1>').

It should be formContainer.innerHTML = '<h1>Thanks! We will get back to you shortly</h1>'

Typescript cannot invoke expression whost type lacks a call signature

1 Answers