Question

首先，我使用Knockout和TypeScript。

给出以下源代码：

class LookupEditorVM {
    lookups: KnockoutObservableArray<LookupVM>;
    selected: KnockoutObservable<LookupVM>;
    baseURL: string = "/Admin/Lookup/";

    constructor() {
        this.lookups = ko.observableArray<LookupVM>([]);
        this.selected = ko.observable<LookupVM>();

        $.getJSON(this.baseURL + "ListLookups", (data) => {
            ko.mapping.fromJS(data, {}, this.lookups);
        });

        this.selected.subscribe(() => {
            this.getListItems();
        });
    }

    getListItems() {
        $.getJSON(this.baseURL + "GetLookupItems/" + this.selected().ID, (data) => {
            ko.mapping.fromJS(data, {}, this.selected().LookupItems);
        });
    }
}

class LookupVM {
    ID: number;
    Name: string;
    DisplayName: string;
    Description: string;
    LookupItems: KnockoutObservableArray<LookupItemVM>;

    constructor(ID?: number, Name?: string, DisplayName?: string, Description?: string) {
        this.ID = ID;
        this.Name = Name;
        this.DisplayName = DisplayName;
        this.Description = Description;
        this.LookupItems = ko.observableArray([]);
    }
}

以下功能让我适合：

getListItems() {
    $.getJSON(this.baseURL + "GetLookupItems/" + this.selected().ID, (data) => {
        ko.mapping.fromJS(data, {}, this.selected().LookupItems);
    });
}

所选的ID属性提供了一些淘汰功能的文本。它应该是一个数字。我还尝试将ID作为数字类型传递给getListItems，但它仍然作为函数文本传递。

我错过了什么？

更新

我已将this.selected（）。ID更改为this.selected（）。ID（）以考虑observable。我还采纳了Mark的建议，并将LookupVM属性更改为可观察的。

Answer 1

Knockout Mapping插件将默认创建它创建的对象中的所有属性asservables（这是＆＃34;函数＆＃34;您看到的值）。所以，这一行：

ko.mapping.fromJS(data, {}, this.lookups);

创建一个LookupVM数组，其中每个属性都是可观察的。类定义中指定的TypeScript类型将被忽略，因为它们在运行时不存在。

这可能就是你想要的 - 在这种情况下，只需将你的属性改为可观察的，例如。

class LookupVM {
    ID: KnockoutObservable<number>;
    Name: KnockoutObservable<string>;
    etc.

并在您的其他ajax调用中使用this.selected().ID()。

或者，您可以告诉Mapping插件复制属性而不是创建observable：

ko.mapping.fromJS(data, {"copy":["ID","Name","DisplayName","Description"]}, this.lookups);

在这种情况下，我不确定您希望如何处理LookupItems属性 - 您可能需要查看documentation。

Knockout observable属性包含功能代码

1 个答案: