Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Calling a function in a typescript file from HTML.

I'm new to HTML and Angular 2. I'm currently trying to figure out how to call a function that's inside a Typescript file from an HTML file.

Stripped down, the Typescript file (home.ts) function looks like this:

getConfigurations(sensorName: string) {
    console.log('Home:getConfigurations entered...');

    return 'sensor1';
}

In my HTML file (home.html), I would like to call 'getConfigurations' with a string parameter (right now 'getConfigurations()' returns 'sensor1' since I'm still testing things out). So, in HTML, how do I go about calling my getConfigurations method with a parameter (for simplicity - how can I call the method inside a simple div panel)? (I already have the value I want to pass in a variable called 'selectedSensor').

like image 474
Roka545 Avatar asked May 16 '16 23:05

Roka545


People also ask

Can we call function in html in angular?

To invoke this function in the html document, we have to create a simple button and using the onclick event attribute (which is an event handler) along with it, we can call the function by clicking on the button.

Does TypeScript work with html?

A JavaScript library has already been developed for this purpose - it's called TypeScript Compile, and it allows typescript to be embedded in HTML (as shown above.)

Can JavaScript call TypeScript function?

TypeScript supports the existing JavaScript function syntax for declaring and calling it within the program or the code snippet.


1 Answers

There is feature provided by angular is events binding by using you are able to call function whihc is exist in your ts file also you can use interpolation syntax of angular to call function like this : -

<button (click)='getConfigurations("parameter")'>Button Click</button>

or something like this

{{getConfigurations('parameter')}}  

for more info related to event binding in angular2 see here

working example Working Plunker

like image 84
Pardeep Jain Avatar answered Sep 29 '22 09:09

Pardeep Jain