javascript - Get value from TypeScript (.ts) in HTML file. - Stack Overflow

admin管理员组

文章数量:1401620

I'm new to Typescript and HTML. I'm building an Angular2 app and I currently have a TypeScript file that looks like this:

import {Http, Headers} from 'angular2/http';
import {Component} from 'angular2/core';
import {CORE_DIRECTIVES, FORM_DIRECTIVES} from 'angular2/mon';
import {Router} from 'angular2/router';
import {Routes} from '../routes.config';

@Component({
    selector: 'home',
    templateUrl: './app/home/home.html',
    directives: [CORE_DIRECTIVES, FORM_DIRECTIVES]
})
export class Home {
    public jsonResponse: string = "";

    constructor(private _http: Http) {
        var thisReference = this;
        thisReference.getSensors();
    }

    getSensors() {
        this.jsonResponse = "testResponse";
    }
}

I'm trying to figure out how to get the value for "jsonResponse" in an HTML file. I've searched but can't find a straightforward way to access the jsonResponse variable - any ideas?

I'm new to Typescript and HTML. I'm building an Angular2 app and I currently have a TypeScript file that looks like this:

import {Http, Headers} from 'angular2/http';
import {Component} from 'angular2/core';
import {CORE_DIRECTIVES, FORM_DIRECTIVES} from 'angular2/mon';
import {Router} from 'angular2/router';
import {Routes} from '../routes.config';

@Component({
    selector: 'home',
    templateUrl: './app/home/home.html',
    directives: [CORE_DIRECTIVES, FORM_DIRECTIVES]
})
export class Home {
    public jsonResponse: string = "";

    constructor(private _http: Http) {
        var thisReference = this;
        thisReference.getSensors();
    }

    getSensors() {
        this.jsonResponse = "testResponse";
    }
}

I'm trying to figure out how to get the value for "jsonResponse" in an HTML file. I've searched but can't find a straightforward way to access the jsonResponse variable - any ideas?

• javascript
• html
• typescript
• angular

Share Improve this question Follow asked May 12, 2016 at 23:19 Roka545Roka545 3,6362323 gold badges7070 silver badges111111 bronze badges 2

• Do you just want to display the value of jsonResponse on the page? – sourdoughdetzel Commented May 12, 2016 at 23:34
• Put this {{jsonResponse}} in your html page – Som Commented May 13, 2016 at 0:01

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 2

Here is what you are looking for: link to working code: https://plnkr.co/edit/Y6TeraRZT2NDnHMRB9B0?p=info

import {Component} from '@angular/core'
@Component({
  selector: 'my-app',
  providers: [],
  template: `
    <div>
      <h2>jsonResponse:  {{jsonResponse}}</h2>

    </div>
  `,
  directives: []
})
export class App {
  jsonResponse: string;

  constructor(){
    this.getSensors();
  }

  private getSensors() {
    this.jsonResponse = 'testResponse';
  };
}

There is also the json pipe

{{jsonResponse | json}}

本文标签： javascriptGet value from TypeScript (ts) in HTML fileStack Overflow