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').

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').

• javascript
• html
• angularjs
• twitter-bootstrap
• angular

• 2 How is your angular app structured? You need to arrange things so the function is in scope and then you can just call it with {{getConfigurations(param)}} but people can't give you proper help without more info. – Paarth Commented May 16, 2016 at 23:19

1 Answer 1

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