尝试在打字稿中动态更新 html

Question

我有一个 html 文件，其中列出了用户的纬度位置。我现在可以在单击调用打字稿函数的按钮时更新 html 文本。我想要的是我的函数被称为 onload，在页面完全加载之前更新文本。我试过使用 onload 函数，但没有成功。这是我的 html，假设我正确清理了我的代码，它应该是可重现的：

<ion-app>
  <ion-content [fullscreen]="true">
    <div id="container">
      <h1>Go-To-Gate Reminder</h1>
      <div class="row">
        <ion-icon size="large" name="walk"></ion-icon>
        <p> Walking speed </p>
        <text id="updater"></text>
      </div>
    </div>
  </ion-content>
</ion-app>

这是我的 ts 文件：

import { Component } from '@angular/core';
import { Geolocation } from '@ionic-native/geolocation/ngx';

@Component({
    selector: 'app-home',
    templateUrl: 'home.page.html',
    styleUrls: ['home.page.scss'],
})
export class HomePage {
    framework = 'At exact boarding time';

    constructor(private geolocation: Geolocation) {}

// use geolocation to get user's device coordinates
getCurrentCoordinates() {
    this.geolocation.getCurrentPosition().then((resp) => {
        this.latitude = resp.coords.latitude;
        this.longitude = resp.coords.longitude;
    }).catch((error) => {
        console.log('Error getting location', error);
    });

    document.getElementById("updater").innerHTML = '&nbsp' + this.latitude
}

Answer 1

尝试从构造函数中调用 getCurrentCoordinates 方法。

尝试在打字稿中动态更新 html

Trying to update html dynamically in typescript

html

typescript

ionic5