CODEWITHSUNDEEP
htmltypescriptdom
ofey
ofey

Reputation: 3337

Basic Typescript Web App

I am trying to pass a typescript variable to a html page.

All the code is on github and running on gh-pages.

I am following a short example here on Typescriptlang.org

This should allow me to put a typescript variable into a DOM but it isn't working.

function greeter(person) {
    return "Hello, " + person;
}

let user = "Jane User";

document.body.innerHTML = greeter(user);

If this isn't possible it is possible to put a template variable in the DOM? Such as might be done with Angular2+,

{{ variable }}

The actual error I get it,

Uncaught TypeError: Cannot set property 'innerHTML' of null
    at app.ts:71
(anonymous) @ app.ts:71

Which possibly means I am running the code before the DOM is constructed.

Upvotes: 1

Views: 230

Answers (1)

ofey
ofey

Reputation: 3337

I got the answer from here

Using window.onload I can load the DOM first and then call the js code,

app.ts

window.onload = function() {
function greeter(person) {
    return "Hello, " + person;
}

let user = "Jane User";

document.body.innerHTML = greeter(user);
}

I was trying to do something simple like this,

window.onload = function() {

let user: string = "Jane";
let sentence: string = `${user} is super
totally cool!`;

document.body.innerHTML = "<p><strong>" + sentence + "</strong></p>";
}

Upvotes: 3

Related Questions