时间戳

首页 > 解决方案 > 以角度4将非静态对象传递给静态方法

angular - 以角度4将非静态对象传递给静态方法

问题描述

我正在使用 Angular 4 应用程序并尝试将当前语言传递给 toLocaleString() 方法。方法 mathoround 是静态方法，不理解 this.translation.currentLang。如何将非静态对象传递给静态方法。

import { Injectable } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';

@Injectable()
export class ChartHelperService {


    constructor( private translation: TranslateService) { }

    static prepareChartTooltipRow(name: string, value: string, additionalStyle: string): string {
        return '<tr style="background-color: initial;"><td style="text-align:left;' + additionalStyle + '"><b>' + name +
            '</b></td>' +
            '<td style="text-align: right;' + additionalStyle + '">' +
            value +
            '</td></tr>';
    }

    static showCcorYAxis(id: number): boolean {
        return !(window.innerWidth < 992 && id !== 0);
    }

    static mathRound(input: number): string {
        return Math.round(input).toLocaleString(this.translation.currentLang, { maximumFractionDigits: 0 });
    }

}

标签： angular

解决方案

不要尝试混合访问静态属性，例如使用类即时。

ChartHelperService 作为静态类

export class ChartHelperService {

    static translation:TranslateService;

    setTranslationService( translation: TranslateService) {
        ChartHelperService.translation = translation;
    }

    static prepareChartTooltipRow(name: string, value: string, additionalStyle: string): string {
        return '<tr style="background-color: initial;"><td style="text-align:left;' + additionalStyle + '"><b>' + name +
            '</b></td>' +
            '<td style="text-align: right;' + additionalStyle + '">' +
            value +
            '</td></tr>';
    }

    static showCcorYAxis(id: number): boolean {
        return !(window.innerWidth < 992 && id !== 0);
    }

    static mathRound(input: number): string {
        return Math.round(input).toLocaleString(ChartHelperService.translation.currentLang, { maximumFractionDigits: 0 });
    }

}

您可以在 AppComponent 构造函数上设置翻译属性

export class AppComponent  {    
  constructor( private translation: TranslateService ) {
   ChartHelperService.setTranslationService(translation);
  }
}

ChartHelperService 在实用程序类中，因此您无需将其添加到提供者列表

更新

ChartHelperService 即服务

@Injectable()
export class ChartHelperService {


    constructor( private translation: TranslateService) { }

    public prepareChartTooltipRow (name: string, value: string, additionalStyle: string): string {
        return '<tr style="background-color: initial;"><td style="text-align:left;' + additionalStyle + '"><b>' + name +
            '</b></td>' +
            '<td style="text-align: right;' + additionalStyle + '">' +
            value +
            '</td></tr>';
    }

    public showCcorYAxis(id: number): boolean {
        return !(window.innerWidth < 992 && id !== 0);
    }

    public mathRound(input: number): string {
        return Math.round(input).toLocaleString(this.translation.currentLang, { maximumFractionDigits: 0 });
    }

}

在这种情况下，您需要添加ChartHelperService到提供者列表并注入ChartHelperService到任何组件中以获取ChartHelperService.

export class TestComponent  {    
   constructor( private chartHelperService: ChartHelperService) {
     console.log(this.chartHelperService)
   }
 }

推荐阅读