如何在.html中调用其他类的静态方法(不在.ts中)? [英] How to call static method of other class in .html (not in .ts)?

问题描述

我通过调用getInstance()创建了一个名为ScoreBoard的类作为全局对象:

I created a class ScoreBoard as a global object by calling getInstance():

export class ScoreBoard{
    protected _myNumber : number;
    protected static scoreBoard : ScoreBoard;

    constructor(){
        this._myNumber=3;
    }
    get myNumber():number{
        return this._myNumber;
    }
    set myNumber(_myNumber : number){
        this._myNumber=_myNumber;
    }

    static getInstance() : ScoreBoard{
        if(!this.scoreBoard){
            this.scoreBoard=new ScoreBoard();
        }
        return this.scoreBoard;
    }
}

并尝试在html页面中调用它:

and trying to call it in a html page:

newscontent.ts

newscontent.ts

import { Component } from '@angular/core';
import { ScoreBoard } from '../scoreboard';

  @Component({
    templateUrl: 'newscontent.html'
  })
  export class NewsContent {
    constructor() {
  }
}

newscontent.html

newscontent.html

<ion-header>
  <ion-navbar>
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title></ion-title>
  </ion-navbar>
</ion-header>
<ion-content fullscreen="true">
    {{ScoreBoard.getInstance().myNumber}}
</ion-content>

但无法显示为错误:

1     689170   error    EXCEPTION: Error in ./NewsContent class NewsContent - inline template:8:31 caused by: undefined is not an object (evaluating 'self.context.ScoreBoard.getInstance')
2     689170   error    ORIGINAL EXCEPTION: undefined is not an object (evaluating 'self.context.ScoreBoard.getInstance')

. .

如何在.html中调用其他类的静态方法?

how can I call static method of other class in .html?

推荐答案

import { Component } from '@angular/core';
import { ScoreBoard } from '../scoreboard';

  @Component({
    templateUrl: 'newscontent.html'
  })
  export class NewsContent {

  scoreboardInstance = ScoreBoard.getInstance();

  constructor() {
  }
}

<ion-header>
  <ion-navbar>
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title></ion-title>
  </ion-navbar>
</ion-header>
<ion-content fullscreen="true">
    {{scoreboardInstance.myNumber}}
</ion-content>

这篇关于如何在.html中调用其他类的静态方法(不在.ts中)?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！