javascript - Valoare AngularJS în TypeScript

Vreau să convertesc o valoare AngularJS în TypeScript.

Cum pot realiza asta?

AngularJS

angular.module('your_app').value('cgBusyDefaults',{
    message:'Loading Stuff',
    backdrop: false,
    templateUrl: 'my_custom_template.html',
    delay: 300,
    minDuration: 700,
    wrapperClass: 'my-class my-class2'
});

Am încercat să creez o clasă cu TypeScript și să inițializez acea clasă în definiția modulului, dar nu am avut succes cu această abordare.

TypeScript

export class CgBusyDefaults {

    private _message: string;
    private _backdrop: boolean;
    private _templateUrl: string;
    private _delay: number;
    private _minDuration: number;
    private _wrapperClass: string;

    constructor() {
        this._message = 'Loading Stuff';
        this._backdrop = true;
        this._templateUrl = 'app/administration/partials/administration-busy.html';
        this._delay = 300;
        this._minDuration = 700;
        this._wrapperClass = 'dv-busy';
    }

    get wrapperClass(): string {
        return this._wrapperClass;
    }

    set wrapperClass(value: string) {
        this._wrapperClass = value;
    }

    get minDuration(): number {
        return this._minDuration;
    }

    set minDuration(value: number) {
        this._minDuration = value;
    }

    get delay(): number {
        return this._delay;
    }

    set delay(value: number) {
        this._delay = value;
    }

    get templateUrl(): string {
        return this._templateUrl;
    }

    set templateUrl(value: string) {
        this._templateUrl = value;
    }

    get backdrop(): boolean {
        return this._backdrop;
    }

    set backdrop(value: boolean) {
        this._backdrop = value;
    }

    get message(): string {
        return this._message;
    }

    set message(value: string) {
        this._message = value;
    }

}

angular.module('your_app').value('cgBusyDefaults', new CgBusyDefaults());

Este posibil să definim Valori cu TypeScript? Sau poate doar ceva îmi scapă

Răspuns #1

Ce se întâmplă atunci când folosești următorul TypeScript?

export class CgBusyDefaults {

    public message: string;
    public backdrop: boolean;
    public templateUrl: string;
    public delay: number;
    public minDuration: number;
    public wrapperClass: string;

    constructor() {
        this.message = 'Loading Stuff';
        this.backdrop = true;
        this.templateUrl = 'app/administration/partials/administration-busy.html';
        this.delay = 300;
        this.minDuration = 700;
        this.wrapperClass = 'dv-busy';
    }
}

angular.module('your_app').value('cgBusyDefaults', new CgBusyDefaults());

Am avut o problemă o dată când am folosit getteri și setteri în loc de proprietăți normale. E doar o bănuială.

Răspunsul #2

Târziu la petrecere, dar dacă ai vrea să convertești direct codul JS în TypeScript, clasa nu este necesară. Ca alternativă, poți face asta:

export interface CgBusyDefaults {
    message: string;
    backdrop: boolean;
    templateUrl: string;
    delay: number;
    minDuration: number;
    wrapperClass: string;
}

export const cgBusyDefaults: CgBusyDefaults = {
    message:'Loading Stuff',
    backdrop: false,
    templateUrl: 'my_custom_template.html',
    delay: 300,
    minDuration: 700,
    wrapperClass: 'my-class my-class2'
};

angular.module('your_app').value('cgBusyDefaults', cgBusyDefaults);

Rețineți că în acest caz trebuie să omiteți apelul new atunci când înregistrați valoarea cu AngularJS, în schimb utilizați direct obiectul literal exportat.

Declarația interface este necesară dacă doriți să aveți o definiție de tip pentru valoarea dvs. AngularJS, altfel aceasta poate fi omisă (exportul const ar fi export const cgBusyDefaults: any={ ... } în acest caz).

Soluția prin clasă are avantajul de a-ți oferi informațiile despre tip în mod implicit, dar a avea o clasă cu un constructor pentru un lucru care este menit să fie o valoare singleton mi se pare nepotrivit atunci când JS/TS au conceptul de literale de obiect care se potrivesc perfect cu valorile AngularJS.