knockout.js - Hur refererar man till TypeScripts enum-värde från knockout data-bind?


Jag försöker få detta att fungera (sidan klagar på att CustomerExperience är odefinierad):

<div data-bind="visible: $data.customerExperienceObservable() === CustomerExperience.Loading">
    Loading...
</div>

där CustomerExperience är definierad i TypeScript:

export enum CustomerExperience {
    Loading = 1,
    Unconfigured = 2,
    Data = 3
}

transpilerad till:

(function (CustomerExperience) {
    CustomerExperience[CustomerExperience["Loading"] = 1] = "Loading";
    CustomerExperience[CustomerExperience["Unconfigured"] = 2] = "Unconfigured";
    CustomerExperience[CustomerExperience["Data"] = 3] = "Data";
})(exports.CustomerExperience || (exports.CustomerExperience = {}));
var CustomerExperience = exports.CustomerExperience;

med kontext tillämpad på en instans av en klass:

ko.applyBindings(dataProvider);

Jag förstår att jag kan få det att fungera om jag definierar CustomerExperience som en egenskap hos den bundna dataProvider. Men jag försöker förstå hur man gör det med TypeScript enum.

Några idéer? :)

PS: För nu använde jag === 1 för att få det att fungera.

Svar #1

Slutade med denna lösning (tack Carrie Kendall!):

public customerExperienceLoading: KnockoutComputed<boolean> = ko.computed({
    owner: this,
    read:  () => {
        return this.customerExperienceObservable() === CustomerExperience.Loading; } });

Och bind det som vanlig boolean:

data-bind="visible: $data.customerExperienceLoading() === true"